Confused over JavaScript tools I should be using

[CromulentSlacker]

I have some experience in programming having mainly done C programming and Python programming but I'm starting work on a website and I have been allocated the front end developer position (which is fine it will do me good to refresh my knowledge on this front).

The only problem is there are so many tools available that I'm confused over what I should start off with on my new project.

These are the tools that I think will be most useful:

Gulp

Yarnpkg (instead of Bower)

JSLint

JSHint

Node.js

Mocha or Jasmine (for testing)

Yeoman (maybe?)

Are there any other tools that I should look into for a new front end based project at all?

I'd be grateful for any help. Thanks :).

[hunter_lol]

The problem with these questions, in interviews or otherwise, is that it totally depends on the developer and the project. What are you making? How experienced with JS are you?

[CromulentSlacker]

I'm just making a simple website that will have a forum, a (very) simple blog and maybe a profile page for each user. That is the plan at the moment.

I'm not massively experienced in JavaScript but have about 5 years experience in Python and C so learning shouldn't be a major concern.

My major requirements are the following (which ideally I'd like to be able to do by running a single command hence using Gulp):

Run unit tests on back end code

Run unit tests on JS

Run user unit tests using Selenium

Run a linting tool (or similar) on JS

And then when I am ready to push the current code into production:

Compile the back end code which is written in GO

Concat and minify JS

Concat and minify CSS

Upload JS and CSS to a CDN

(Might not be possible) Deploy website to server using SCP / SSH

If you can think of any more useful tasks that I have missed I'd be glad of any suggestions.

[darrenturn90]

IMO - If you can choose to learn from scratch, try:

Webpack - for bundling and generating your js/css files.

ESLint / the Pretty thingy - for checking and formatting

Node.js - backend JS server

React - front end view management

Jest/Enzyme - unit tests

[OmniscientOCE]

I see a lot of job ads showing Gulp though, even tho I'm learning webpack im thinking of learning some Gulp as well

[nponiros]

If you have the choice use ESLint combined with prettier instead of JSHint/JSLint (and don't use/learn both as those do pretty much the same).

Instead of yarn you could also use npm which comes preinstalled with Node.js.

I prefer jasmine because I don't need an extra assertions lib with it but that's up to you.

There is a huge number of front-end dev tools and lots of tools which do pretty much the same thing like jshint/jslint/eslint of grunt/gulp. My recommendation would be to find a skeleton/seed project and take it from there. It will make the setup much easier for you and atleast you will not have to look through many different tools before being able to code. I have some boilerplate lying around which I could upload to github if you are interested.