How I Begin New JavaScript Projects

I found myself writing and rewriting this process on so many blog posts that it felt like it deserved a post of its own.

These are the steps I take when I am starting a new JavaScript project, whether as a client-side script or a server-side project with Node.js.

Step 1: Create the Project Directory

I like to keep all my code projects together on my machine. To do so I created a directory called workspace within my home folder.

What's inside the workspace directory mimics the structure of repositories on GitHub. For example, the code for this website is at @seancdavis/seancdavis-com on GitHub. That means it lives at ~/workspace/seancdavis/seancdavis-com on my machine.

The first thing I do when starting a new project is create a directory for the code and navigate to that directory. Here's an example:

$ cd ~/workspace/seancdavis
$ mkdir new-project
$ cd new-project

Step 2: Add package.json

Next, I add an empty package.json file. The npm command has a handy init option. And if you pass the -y flag to it, you'll end up with a valid-but-mostly-bare package.json file.

$ npm init -y

That will create a package.json file that looks something like this:

package.json

{
  "name": "new-project",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "keywords": [],
  "author": "",
  "license": "ISC"
}

Step 3: Setup Git

Then I initialize the git repository.

$ git init

And then I make sure I'm ignoring the node_modules directory by adding a .gitignore file:

.gitignore

node_modules

Step 4: Install Dependencies

Next, install the dependencies you need. Usually I know the first few packages I'm going to start with. This will vary from project to project.

$ npm install ...

Step 5: Add Scripts

There's almost always some sort of build or run process for the code. I tend to set those up next. They may change over the course of the project, and that's okay. But it's a place to start.

For example, if it's a Node project, I'll probably start by adding a build script that runs the node command against an index.js file. That would look like this:

package.json

{
  // ...
  "scripts": {
    "build": "node index.js"
  }
}

Then I'd be able to run the build through the npm command:

$ npm run build

Step 6: Get Building!

Then it's time to get down to business and make that thing awesome. Or play around for awhile and throw it away. Whatever your case may be, I hope you have a little fun along the way!