Where to start?
Exploring an existing production code base can be challenging. Fortunately, the more you do it the easier it becomes. Here are some steps you can take to evaluate and analyze the existing code in order to gain good working knowledge of it. Keep in mind that it will take time. Similar to the way you would eat an elephant, approach this task one step or bite at a time.
Bite 1: Get Familiar With The Functionality
Get a sense of what the app does.
- Learn its features and functionality.
- Create a Dev.to account and click around the real application.
- Create a post, follow your partner, comment on their post and explore as much of the functionality as possible.
- Keep in mind what data you are creating, reading, updating, and destroying and how that ties to the data model you created a visual for above.
- Focus in on the functionality that is applicable to your track.
Bite 2: Understand The Data You Are Working With
At a high level, most web apps are a way to store and retrieve data from a datastore and display that data to users. To understand a web app, you must first understand it’s underlying data.
Use Rails ERD or a similar tool to create an Entity Relationship Diagram in order to understand how the data is modeled in the database. Get to know which tables exists, what data is stored in each table and how each database table relates to one another.
Besides using these tools, it is important to follow the flow of data. A good place to start is by looking at the
routes and tracing the flow of data through the various views/controllers/etc. of the application!
Bite 3: Identify The Code You Need
Once you have a good idea of the structure of the underlying data and how the app is currently functioning, dive into the code.
- Focusing on the functionality that is related to your track, find a place to start that makes sense to you. Maybe it’s the controller, maybe it’s a component in the UI?
- Start to follow the code through the code base and see where it takes you. A good way to
follow the codeis to search for a specific method, class, etc. and see where it is being used in the entire codebase - this will also help you see how the app is structured!
- Trace the code from the view/component to the database.
- As you explore, make a list of all of the applicable files AS IT RELATES TO YOUR TRACK!
- Don’t worry about going through the code that is not related to your track. It’s ok not to understand all of the code upfront, this usually happens over time.
Bite 4: Figure Out What Is Happening In The Code
Now that you have identified the files that matter to you, walk through them line by line.
- Annotate each file according to the instructions here
- If you come across code you don’t understand or syntax you don’t recognize, do some research to understand if this is domain specific language for library.
Bite 5: Locate, Learn, and Improve Testing For That Code
Once you are familiar with the code for the functionality that is of interest to you, read through the tests associated with this code.
- Is the code well tested? If yes, great! If not, add some additional tests.
- It’s important to know that once you start adding new functionality you will not break the existing functionality or if you do you will be notified with a failing test.
Bite 6: Add New Code
By now you should have a good understanding of:
- the data model
- how specific functionality works
- the underlying code for that functionality
You have also ensured that you have a safety net, or tests in place to keep you from breaking existing functionality. You are now ready to focus on how you will implement new features!