Search:   Dictionary All Posts
Store Your Knowledge at the Brain Bank!

How to Analyze Code on a New Project

Summary - When joining a new project or a new team you will need to analyze new codebases and familiarize yourself with the project. This is a typical workflow for getting started on a new project in javascript or node.
Fork and Clone
Fork the project then clone it to your desktop or other folder on your computer and cd into it.

npm install
install all of the packages and dependencies. While you are waiting...

Read the package.json files
Open the package.json file and look it over. This will tell you a great deal about the project before you even get started. It will tell you what framework is being used, what backend, what database, as well as all the middleware and extraneous packages. It is not vital to understand each of them, but understand the big ones. React with Express using MySQL and knex, for instance.

npm start the project
See what the start function is and npm start the project. Before you really get into it, just start and see what it is. If there is a 'register' try to register. Get the app working on your machine. This may lead you to realize you need a database setup. Setup the database.

setup the environmental variables
Database connection details
api keys
Get the app working as it does in live mode...

Start Analyzing Code
Open the highest level file, for instance the server.js on the backend or the index.js on the frontend.

Frontend Analysis
On the frontend, look for the entry point, where the 'root' of the file is routed to. Typically this is the App.js file. Start at the top and look through the required dependencies and packages to see how the project has been structured to this point.

Look for the state to determine if they are handling state locally or via Redux.

Read the code as if you would a book and try to understand what is happening. Take note in your head of naming conventions or other things you see that could be improved but WARNING: do not just start criticizing code you know nothing about. You were not there when they built this. You do not know the reasons they did certain things. For instance, maybe this project was built by a junior developer being trained by a senior developer. Maybe they were in a crunch for time so built a most viable candidate and did not optimize. Senior developers do not criticize at first, they try to understand.

Backend Analysis
Open the server.js file and look at their setup. Checkout their middleware and then look at their endpoints. Understand how they are handling routing. Take a look at their folder structure. 

Important Note - Give yourself time to understand the project!
Most projects will be very big and will have had been worked on for months or possibly years before you got there. It is not possible for you to understand or memorize the entire project.

Just start by getting an overview as explained above. As you are given assignments on the project you will start learning one little aspect at a time in greater detail. Little by little you will become familiar with the entire project, but this does not happen immediately. Give yourself time.

More tips...
Start console.log() in a few places and run the app to see what happens and when. Start making very small changes to see what you can do. Then revert it back. Do this to familiarize yourself with the project and also to start making it your own.