Create a simple, end-to-end web application that encorporates your typical client and server tech stack. In short, build a CRUD app - the world famous Todo list app
I followed this as a reference as it very neatly laid out the basics and structure of exactly what I wanted to build. I’ve made the following changes/additions:
MongoDB is a documented based (JSON) distributed database built for modern apps and popular in the web realm. It was lightweight and easy enough to get start with.
Instead of opting to install it on my PC - I decided to use the mighty
Docker instead! I’ve recently fell in love with Docker after using it to set up an ownCloud instance, a few nginx containers and traefik (for reverse proxying).
docker run --name restful-api-mongo -d -p 27017-27019:27017-27019 mongo:3.4-xenial
--name restful-api-mongo- create a new container restful-api-mongo
-d- run in detatched mode (i.e. it will run in the background even after you close the terminal window)
-p- specifies which port we want to map to: The mapping is as follows:
HOST_PORT:CONTAINER_PORT, hence we’re mapping the range 27017-27019 from the host machine (your computer that you’re using) to the container’s port 27017-27019.
mongo:3.4-xenial- specifying the image name (
mongo), and it’s version (
docker ps- and you should see something like this:
Now that Mongo is setup and running, I can now start our webserver.
Since we’re using an MVC pattern, the classes are separated accordingly:
Schema- which is the allows us to do JSON schema validation
expressis passed to it so it can set these routes on it using
bodyParserwhich we use for parsing incomming requests bodies in middleware before the handlers. Thus allowing us to access the body via
Since we’ll be fetching data from the server via the Web API - we’d need to do this in an asynchronous manner - i.e. when we request something, the response is not be instanteous - thus we must rather wait for the response to come back and handle it once it’s returned.
I looked at the differences between async/await vs Promises and opted for promises. I did later read in this article that async/await out performs Promises. Perhaps I’ll try using async/await in the next project.
I made use of the
fetch API to handle all requests sent to the webserver.
modelas parameters when instantiated
.bindI used arrow functions since they preserve
db.js, to facilitate all calls
fetchAPI calls are performed
Start the following in this order: