My journey through the full stack

Francois Huyghe
Aug 8, 2017 · 3 min read
Illustration by Mercedes Bazan

A month ago, I started the development of my first Node.js/Express/React.js web application. It has been a learning process and is still a work in progress, but I thought I would share the little bits of knowledge I acquired along the way and hopefully help others that have started a similar endeavor.

I consider myself a developer. I understand the logic of coding and can make my way through any new code I stumble upon. But by no means am I an expert yet. I am really good at putting pieces together (or at least I somehow make it work), but if my language or method of action is not perfect, please let me know.

The project

The purpose of the application is to display the list of all art events in the NYC area. The data is provided by artcritical.com and the tool will live on their website.

A listing tool was originally created on Wordpress using their relational SQL databases. It was mixed with the magazine articles and grew bigger over the years, making the tool slow and clunky.

By moving the listing tool to its own optimized full-stack solution, we hope to make it faster and more intuitive. The UX and design have been revisited and will provide the user with a great new interface.

The technology used

The project started with a simple Node.js, Express and MongoDB back-end setup. The front-end was using Jade (then Pug) as the HTML template tool , Javascript/JQuery for the interactivity and Sass for styling.

The data lives on a MongoDB database and Mongoose is used to read and write it.

React was added for the front-end and is using React-router and React-Dom. The React UI architecture is designed with Facebook’s Flux and its Action-Store-Display system.

The authentification is using Passport.js and is still a work in progress.

Everything is compiled using Webpack and Babel, both front-end and back-end since the application is rendered using React on the server side.


Why MongoDB instead of DynamoDB?

The project was first started with the Amazon Web Services (AWS) and using DynamoDB. Because the database objects needed to be sorted by a few different values (Start Date, End Date, Event, Location), the strict Index architecture of DynamoDB was not cutting it. The two databases also needed to be connected and MongoDB just seemed like the logical tool to use.


Problems and solution

In the coming weeks, I will post the problem I encountered, the solutions that I came across and the resources that I’ve used to fix it. I will explain the problem in the best way that I can and I hope this will help people who end up in my situation.

Nested routes rendering with React-Router and Express is not working
Dynamic redirect using react-router

Francois Huyghe

Written by

Enthusiasm enthusiast. Partner at 13milliseconds

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch
Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore
Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade