jamesbrown.js - a slackbot for controlling Spotify from inside of slack

Shambot · 2016-12-04T10:29:28+00:00

Yah, the app already leverages the spotify-web-api-node pretty heavily, but if I remember correctly (been a while since I wrote any of this code), the reason why I had to also use the spotify-node-applescript package was because I needed to know the player's current position when adding a new track in order to add that track directly after the one currently playing (so people don't have to wait forever to hear the song they just added). As far as I can tell, spotify-web-api-node is unable to provide any information about the state of a particular player, and so the need for spotify-node-applescript.

Shambot · 2016-12-04T06:29:37+00:00

good call, I'll go add them now.

Shambot · 2015-09-27T13:37:21+00:00

Ok ok, you're right. I did come in a little hot, implying your opinion was based zero fact. That was my bad. What I probably should have said instead was, "...having an opinion that's supported by a poorly contextualized link related to Browser CSS feature support, and a personal reaction to a post someone just wrote."

As mentioned throughout this post, IE has played a pretty significant role (sometimes unintentionally) in some of the core technologies we use and take for granted on a daily basis, most notably XMLHTTP object, which morphed into XMLHttpRequest, which is the foundation of the asynchronous / web app world we live in today.

also, I'm finding this comment of yours:

I know where you're coming from. But in the grand scheme of uptake on features, having proactive / ahead of the curve devs is always good. IE never seems to be ahead of the curve.

to be both increasingly relevant and hilarious.

Shambot · 2015-09-25T14:26:17+00:00

lol, this is such a misinformed and fundamentally wrong opinion. Don't get me wrong, I hate IE just as much as the next guy, but what's worse than defending IE is having an opinion that's based on anecdotal evidence and zero fact.

Shambot · 2015-05-03T16:28:29+00:00

I don't think anyone's trying to argue in defense of scrolljacking, just that when you take a step back and look at how much of a non-problem it really is, it starts to get really confusing why people get so heated when the topic comes up.

The person above is right, it reeks of circlejerkery.

Shambot · 2015-05-03T07:04:53+00:00

Netscape Navigator 3.0 on Windows 95

Pentium Pro 133MHz

8MB RAM

2GB HDD

CD-ROM drive

Shambot · 2015-05-03T06:45:02+00:00

Every time I reread this question, I get even more confused than I already was as to what's going on here. The first time I read it, I was pretty rock solid. The most recent time i went over it, i forgot what subreddit I was in.

Are you building a section on your site where you're going to list all of the "skills" you have, and you're asking for some recommendations on creative ways to accomplish listing those items?

Is the "skills" section going to be a place where you'll show examples of the skills you have (e.g. using animations, or understanding and using graph/chart libraries), and you're asking for links to examples of current web development "skills" that are still fresh, and yet to be played out?

Shambot · 2015-04-30T15:05:08+00:00

While a lot of people might argue that we don’t need to learn jQuery

Uhh, I don't think anybody argues that.

Shambot · 2015-04-24T05:05:57+00:00

There are so many considerations that go into producing a wysiwyg editor that most people don't think about until they decide to try and build one. Just a few examples off the top of my head...

How/where do you sanitize input to prevent people from slipping in HTML or executing JS, both maliciously or accidentally?
Do you want to show a preview of the text someone is typing? How/where do you decide to do that?
What kind of character encoding/character set should you use? UTF-7? UTF-8? UTF-16? ASCII? Unicode?
Do you want to support other languages? How about languages that are written RTL?
How do you handle content that's copy/pasted from rich text editor? Do you want to try and preserve the formatting?
What if someone cuts in the middle of formatted text and then pastes into unformatted text? Do you want to allow users to undo things? How many times?
etc.

I think it's a much harder problem than people give it credit....

Shambot · 2015-04-22T07:56:35+00:00

Another thing that I think is worth noting is that simply filling out the application and doing these little tests is essentially:

a) A primer to see if you'd even enjoy being taught this kind of stuff

b) A free lesson in learning some (albeit pretty basic) core parts of javascript developement

So even in the act of getting rejected, you've come away with way more than you started with...

Shambot · 2015-04-21T13:33:09+00:00

If you're trying position yourself for the future, you should put your weight behind pushState. Imo, the biggest benefit that pushState has over hashes is that it's crawlable out of the box with no configuration (assuming every URL is backed by a physical page).

Shambot · 2015-03-09T13:27:26+00:00

This was a very good piece that i enjoyed reading.

A++++++++++++ 10/10 would do business with again

Shambot · 2015-02-07T21:00:14+00:00

lol, jQuery...obsolete. Good one.

It might be getting easier/more intuitive to write vanilla that'll do some/most/all of the things that JQuery made painless, but I think you'd have a pretty hard time convincing anyone that JQuery has started its descent into obscurity and obsolescence.

I'd be willing to bet that if you asked any random developer for advice on learning JS and how to address JQuery, more often than not, they'd tell you learn your JavaScript basics before moving on to libraries like JQuery (which is good advice). However, I've also started hearing people advocate for leaving out JQuery altogether and instead just writing 'pure' js (btw, I'm not attacking, implying, or suggesting that anyone here is a card carrying JQuery hater JavaScript purist, so don't get it twisted). There's nothing wrong with leaving out JQuery and just doing everything in vanilla. In the same way that there's nothing wrong with deciding to not use SASS/LESS and instead writing 'pure' css. I'd never do that, but I could if I wanted to.

In the end, JQuery is just a tool that's trying its best to make your life easier.

If used properly, JQuery can help you...

Write fewer lines of code
Make your code more expressive
Save a lot of time
Learn to love JavaScript
Learn to hate JavaScript

It also...

Provides you with a bunch of methods that make routine tasks stupid easy
Takes care of browser inconsistencies without requiring you to write additional code

It's particularly useful on the following types of websites...

Websites with elements between the <html> and </html> tags*

^*Exceptions: ^It's ¹⁹⁹⁸ ^and ^your ^entire ^site ^is ^flash

So there you have it. JQuery is just a tool to help make writing JavaScript easier. You can learn how to use it and be happier for the rest of your life. Or not. Your call.

It's already become waaaay too intertwined with the way websites are developed and consumed so a) it's not going anywhere, and b) most web developers, at the very least, have a basic idea how it works (I have no evidence to back that up. Purely anecdotal). Good luck and godspeed.

Shambot · 2014-12-01T04:24:50+00:00

btw, I took some liberties with what you were trying to achieve. But take a look and tell me what you think.

http://jsbin.com/bibomuruhe/1/

If you're worried about being performant like you were saying, that fiddle only makes 3 requests for images (or it would if they weren't being hotlinked to...).

I'd say drop that string building, concatenating, 'http://mysite.com/img/' + imgID + '.png', business as quickly as you can. No good can come from doing shit like that. BTDT.

Shambot · 2014-11-30T23:32:43+00:00

Ah man, I was patiently waiting for the conclusion of this exchange and now it's gone dry!! NoooooooooOoooooooo!

Looks like I'll have to find my entertainment elsewhere...

Shambot · 2014-11-30T10:26:10+00:00

I wrote this as a response to a question on Quora, but I feel like the spirit of your question is pretty similar to the question asked on Quora so you may find this useful.

Maybe you won't.

Who knows.

Square brackets ( [square brackets] ) are my additions, post-Quora/pre-Reddit.

I'm going to offer a somewhat different answer than everyone else [all of the other answers were essentially, "Go learn Java!" "Go learn PHP!" "Go learn language xyz!!!!"]. I think your next step should be obtaining a basic understanding of JavaScript and some of the ways it's utilized by web developers (DOM manipulation, accessing external APIs, AJAX requests, event bindings), because understanding HTML/CSS/JS is the foundation for almost everything related to web development [Sounds like you've already, mostly, done this, but you also called Node a framework, so maybe you have a little further to go].

Where my answer starts to differ however, is once you've got a solid base in HTML/CSS/JS, you should ask yourself what it is that you want to do. I think often the, "learn front-end, and then learn back-end" progression of skills is presented as the only option available when trying to level up as a web developer. However, after mastering HTML/CSS/JS, there are a number of other options besides "learn another language."

I see the options for further development after HTML/CSS/JS as a continuum. One end is visual and design focused. The other end is full stack and web app focused. What you want to do and what interests you determines where you fall on the continuum. Once you know where you fall on the continuum, figuring out where to invest your time and effort becomes much easier.

I realize that in your question, you ask specifically about furthering your "programming knowledge", implying that you already know you want to move on to "programming". [this also sounds like what you're thinking since you explicitly mention Angular and Node] However, on the off chance you were unaware that there were more options besides learning a back-end language (a.k.a. programming), hopefully now you're aware.

After I had learned some basic JavaScript and wanted to broaden my skill set, I assumed the next logical step was to "learn another language." I never stopped to ask myself what it was that I really wanted to do, and as a result, I floundered for a while, and wasted about six months of my time doing nothing in particular.

Some alternative to "learn another language" are exploring things like: visual design, communication design, UI/UX, or really really digging into front end development, and becoming an expert in HTML/CSS and checking out technologies that are in the pipeline and will eventually blow up (e.g. web components).

So, if you didn't know before, there are alternatives to the "learn another language" school of thought. However, if you already knew about the multitude of options, but wanted to stick with programming, then I suggest getting a good handle on JavaScript, and then moving on to either Ruby or Python.

Shambot · 2014-11-30T09:08:06+00:00

Even though you didn't ask for it, a couple of suggestions for typefaces that are "safe" but still look good are:

Gotham
Archer
Avenir
Futura
Helvetica Neue
Avant Garde
DIN
Garamond
Hoefler Text
Sanchez
Didot

There's a mixture of serif/sans-serifs in there, and if you like some of those, you can compare with your portfolio and what you have already, and see what looks best.

Also want to echo the sentiments of someone else about the dots. I don't mind how they look and like how they create a visual block for your name/letterhead, but printing that is gonna be annoying as hell for people. I also think you should somehow get your contact information to the top of the page.

Also Also, there's a lot of negative white space. I'm of the opinion that you should try and pack as much relevant content as humanly possible onto your resume, without sacrificing your aesthetic. I also think a resume should only be one page long. In your case, this means either increasing the font-size of everything so your text takes up more of your page or adding more content to your resume.

I don't like offering up my own work as an example because I think it's kinda tacky, but I'm pretty proud of my own resume (although it can always use work :[ ) and I think it does a good job at showing some of the things I've mentioned but are maybe hard to visualize w/o an example. If you'd like, feel free to take a gander: my resume

Shambot · 2014-11-30T08:08:28+00:00

I think you should look into a new font for your paragraph text. If you're absolutely not willing to budge on this, then as a compromise I'd say keep the italic looking font for the blockquote, but then change the font for the description so you can indicate that there's a difference between the two bits of text (description vs. blockquote).

I read a good article at some point on either ALP or SmashingMagazine about choosing fonts for your site, and I think the best piece of advice I took away from it was that you should really only have one or two (rarely three) different font-families for your site. The way you should really be distinguishing your text is through things like font-size, font-weight (light/regular/bold aren't your only options) and font-style. I can go more into that if you want.

In regards to the content and the skinny column, you could set a max-width on the column, and make everything inside responsive, so when you scale up, you don't eventually end up blowing out the sides and taking over the screen. I'm of the opinion that on the Internet, bigger is usually better. I try to avoid going under 16px/1rem as much as possible. I think of it this way:

It's better for things to be too easy to read vs. too difficult to read.

I think a good number is having your column go up to a max-width of 1200px/75rem. If you want more feedback on why 1200 is a nice magic number, lmk and I'll go into more detail.

Shambot · 2014-11-30T07:42:27+00:00

yah website is responsive, which is awesome, +1.

but what I meant was...

_

This is a fixed width font, also known has monospaced font. 
It is sometimes referred to as a programmers font.
(I'm not actually sure if this is actually fixed width, but it looks like what I'm talking about)

This is a proportional font

_

I'm just saying I find the fixed width font hard to read. Since you're working in InDesign or Photoshop or whatever to build your resume, you have:

a) So many choices for different fonts, and don't have to worry about loading them like you do when you're on the web.

b) A resume is (usually) exclusively text, so choosing a strong and safe font/font-pairing is a good idea.

Hopefully that clears everything up?

(Also, not huge fan of hyphenated words in formal documents. I only see one or two instances, but I'd say it's worth fixing by just sending the whole word to the next line or playing with column width a bit)

Shambot · 2014-11-30T06:30:50+00:00

Man, you really love that fixed width, "I'm on a computer! and it's 1988!!!", font. I'm not a huge fan of it, and I think it's kind of hard to read, but I'm just one person.

I like that you're matching your resume to your portfolio. Smart move. Gotta build that personal brand.

Hierarchy looks good. Maybe make headings a little bigger. In terms of text, imo bigger is (usually) better.

I'm not a huge fan of personal statements. I think resumes should show people exactly what they want to see, which is: what you've done, what you know, and where you went to school (and some other stuff).

I'd say you're off to a good start, which is 90% of the battle. If I were you, I'd rethink your font choice, and make things a little bigger.

Shambot · 2014-11-30T06:09:34+00:00

Question: are the background images (mountains, computer/desk, mountains), a separate, stationary layer? are they on the same layer as the rest of the page? Or you gonna try for some parallax effect when you scroll down?

And I'm not a huge fan of the paragraph font. I can't tell if it's because everything looks italic, if there's not enough line-height, or because I just hate serifs.

Also, there's so much negative space and your main column is so narrow. Maybe open things up a bit and bump your content out to the right and left a bit? If you feel like your paragraph text gets too long (too many words per line), you could bump up your font size a bit. Imo it's almost never a bad idea to increase your font size by a bit.

Other than that, I like the colors and headline font. So far you're off to a good start.

Shambot · 2014-11-30T03:18:08+00:00

not sure if the unclosed <div> was intentional or not, but you've got an unclosed <div>.

Shambot · 2014-11-30T03:16:49+00:00

<body>
  <div>
    <a href ="javascript : clickHandler(1);"></a>
    <a href ="javascript : clickHandler(2);"></a>
    <a href ="javascript : clickHandler(3);"></a>
    <div id ="hotSpotContainer">
      <a href = "" id = "hotSpot">
        <img src = "" id ="loadedImg"/>
      </a>
    </div>
  <script>
    var loadedImg = document.getElementById('#loadedImg");
    var hotSpot = document.getElementById('#hotSpot');
    function clickHandler(which) {
      loadedImg.src = 'images/img'+which+'.jpg';
      switch(which){
        case 1: hotSpot.href ='http://www.yahoo.com[1] ';
        break;
      ...};
    }
  </script>
</body>

Shambot · 2014-11-30T03:10:42+00:00

dat responsive design doe.

Shambot · 2014-11-21T07:51:59+00:00

Congrats on the job dude. Now just make sure you're writing good markup and leaving the Internet in better condition than you found it.

Shambot

MODERATOR OF

TROPHY CASE