SPACE WALK

Summary of what I learned

For this project, even though I chose technologies I have previously worked with, I realize there is always an opportunity to learn more, especially when starting a new project from scratch. In this case, I tried to expand upon some concepts I had learned previously in different frameworks / projects but had never really gotten a chance to implement on my own. Namely:

Dependency Injection

Having worked with both C# and Angular 2+ versions before, I was familiar with the concept of dependency injection, namely the idea of creating singular instances of any dependencies that are required in a particular module. However, I had not gotten a chance to explore these concepts more thoroughly in Javascript until now. For example, with this project's back end, I made a point of instantiating the node server with singular instances of dependencies like the logger and the (mock) database.

I ultimately chose not to experiment with a DI pattern in React because I was only able to find one article referencing how to implement such a pattern. The gist is that it seems possible using React Context to inject an instance of a service globally and components could then consume the service as needed. However, I felt like this was generally unnecessary in the first place since I am not calling services directly from any component. Instead, I dispatch actions which then lead to services being called inside of a saga.

Project Architecture

As I'm sure any engineer can attest, there is often a huge difference between the architecture of small scale projects built in tutorials and the architecture for a project built for a multinational company at scale. I tried not to think about this project just as something to build in 2 hours and forgot about. But rather, I tried to think about this project as something that could be scaled more easily if necessary.

There are a number of articles I researched on Node architecture, many of which have very different setups from one another, before ultimately committing to an architecture that made use of principles found in these articles:

• Node Best Practices
• Structure of a Node API project
• How to Organize Your Routes in Very Big Applications

What I struggled with

Time. Specifically, in the planning and designing stage. It's one thing I've realized to build in a design (I mean design in both a UI sense and a project architecture sense here) that's already been made or recommended for you. And it's another to be given complete freedom to come up with a style on your own. I struggled a lot in just choosing what I even wanted to build in the first place and how I wanted it to look once I did know.

I also came to realization that I could not do everything that I wanted to do simply because there wasn't enough time. For example, while I implemented some of the logic on both the front end and back end to handle the propose time slots form, I didn't have enough time to design and build the actual form.

If I had more time, I also would refactor the backend to use Typescript with more time as I believe using static typing would greatly help to reduce the probability of errors related to typing and it would speed up development in the long term. While I am very familiar with Typescript thanks to my work in Angular, I hadn't used it in Node before and I didn't want to slow myself down by trying to do too many new things.

And of course, I would definitely add tests to both the front end and back end with more time.

Things I'm proud of

• My conceptual understanding has come a long way: In building this application, it hit me both how far I've come in development but how far I still have to go. Being able to build an app on my own while leveraging my understanding of concepts like generators, async await, and dependency injection makes me feel very proud.

• Project architecture: It's not perfect but I'm proud of how modular I was able to make the app and I think I have separated concerns fairly well. While I would probably play around with the front end project structure in a future application, I'm fairly happen with the architecture I chose for Node. The project files are organized by each route and its function rather than simply by function (e.g. there's one giant controllers folder and one giant services folder).

• Design: To be clear, I am not a designer but I am proud of the design I came up with for the modals, tables, etc. In case anyone is interested, to go along with the Astronaut theme, I chose to work with colors from the official NASA color palette

Instructions

The client is set up to run on a webpack server independently from the API server. So you will need to have both the client and the API server running at the same time in order to run the app properly. To set up:

Setup

• First, in your terminal, go to the client folder and run: npm install to install all dependencies from each folder
• Then go the server folder and run npm install
• To run client, go to client folder root and run npm run start:dev
• To run server, go to server folder root and run npm run server:dev
• Once both servers are running, navigate to http:://localhost:3000 to run the app locally
• For reference, the API server will be running on http:://localhost:5000