Giter Club home page Giter Club logo

step-by-step-express's Introduction

Step by Step Express

The intent of this project is to take you step-by-step through the process of building an Express app, documenting the changes as bite-sized chunks that you'll ideally be able to pick up and iterate upon rapidly.

Step Zero

  • Initalize the repo with the universal documents that we should have in every project

Read more in the Step Zero README.md

Step One

  • Set up a very basic HTTP server + add the dependencies

To run the Step One code:

# make sure your current working directory is the main directory of this repo
cd step-one
node app.js

Read more in the Step One README.md

Step Two

  • Set up a very basic HTTP server + add the dependencies

To run the Step Two code:

# make sure your current working directory is the main directory of this repo
cd step-two
node app.js

Read more in the Step Two README.md

Step Three

  • Start parsing the querystring passed to the web app and โ€“ if the querystring id is present โ€“ passing that value to the API we're hitting, via the request module.

To run the Step Three code:

# make sure your current working directory is the main directory of this repo
cd step-three
node app.js

Read more in the Step Three README.md

Step Four

  • Add view rendering with handlebars (via express-handlebars)
  • Create our first view
  • Start rendering comics with handlebars on the /comic path

To run the Step Four code:

# make sure your current working directory is the main directory of this repo
cd step-four
node app.js

Read more in the Step Four README.md

Step Five

  • Call Express's static method to serve CSS
  • Create the /static directory + add our CSS file to it

To run the Step Five code:

# make sure your current working directory is the main directory of this repo
cd step-five
node app.js

Read more in the Step Five README.md

Step Six

  • Add Added error handling
  • Add port detection (process.env.PORT) that allows us to ship it to Auzre
  • Add favicon.ico to make browsers happy

To run the Step Six code:

# make sure your current working directory is the main directory of this repo
cd step-six
node app.js

Read more in the Step Six README.md

Step Seven

  • Dockerized
    • Add Dockerfile
    • Add .dockerignore
  • Add host variable to detect if HOST environment variable is defined, defaulting to 0.0.0.0 if not.
    • Express now listens to the host as its host
  • Add start npm script, which can be called with npm start

To run the Step Seven code:

# make sure your current working directory is the main directory of this repo
cd step-seven
node app.js

Read more in the Step Seven README.md

step-by-step-express's People

Contributors

bnb avatar johnpapa avatar

Watchers

James Cloos avatar Sarper Yasin MUTLUBAY avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.