DEV Community

loading...

Jr Dev Problems: Navigating Your First Large Codebase

mariel profile image mariel ・5 min read

I started my first full-time dev job at the end of October, 2020 (or somewhere around March 241st). Previously, I'd done a 6 month internship at a think-tank here in Washington, DC., where I worked on data-viz projects. I don't have a CS degree or an engineering background; I graduated from Flatiron's software engineering bootcamp in October 2019. Being a developer is one of my favorite things.

Another of my favorite things is learning from other developers. On the Twitter machine recently, I saw that other junior devs can have trouble navigating their large codebases and figuring out where to start and:

We're going to walk through how I found my way around my current project and some reminders that might make things easier the next time around.

Problem

When I started, I was pumped to be assigned to a project and start poking around the repo. And then...I realized how big a complicated production-ready web-app really is.

In my bootcamp we learned to use Rails for backend work and React for frontend, and we'd been required to build something using a React client to talk to a Rails API.

BUT.

The gulf between your First Project(™) and "here's a sophisticated project produced by experienced developers for a client with a lot of requirements" is just

Add to that the nerves of being new to a job, new to a career, and wanting to help but not wanting to be in the way, and suddenly you're sitting at your desk like:

Path Forward

IT’S FINE WE’RE FINE WE CAN DO THIS.

I decided to do what I’d done in my past work: think about and keep in mind:

  1. What do I know that’s similar to what I need to know?

  2. What comparisons or connections can I make?

  3. Where can I get the information I’m missing?

Getting Started

In my bootcamp, one of the first things we learned about was MVC architecture. I went in to this new project knowing it’s a web application that lets users log in, manipulate some data, save it, and log out. That means I knew:

  • There’s a backend, somewhere, letting the users read-write information

  • There’s gotta be a frontend, with the different pages and forms the user can see

  • There’s gotta be a way for these two things to talk to each other

Is it all way more complicated than this? Yes. Did I need to know how or why? No, not yet, I was just trying to get my bearings. The MVC knowledge I had was useful because it gave me something to visualize in my head and a place to start re: terminology. No two repos are the same, no two teams are the same. But - devs gonna dev, so we at least tend to use similar names and structures for things.

The Hunt for Things I Recognize

At work, my title is “Junior JavaScript Developer” - I’m not a backend dev, and the backend work I’ve done since finishing my bootcamp has been minimal. So, starting out, I know when looking at this huge repo map that I need to find Frontend Land. Comparing our repo to what I’d worked with in the past, I know I need to find something called “screens” or “views”. At minimum I need to figure out where the React files are hiding.

The root of our repo has 9 directories and about 22 files of various configuration things that the backend devs understand. Inside each directory, however ….

BUT! Conveniently, one of the root directories is actually named “frontend.”

I start there.

Comparisons and Connections

Alright, I found the frontend! Literally. Good start.

Inside frontend I see...4 more directories. And a bunch of other files.

BUT. I'm starting to see things I’m familiar with. First, I’m getting closer to the right file extensions - .js instead of .py or .yml. Second, I see a src folder. My own bootcamp project had a src folder, and I know that’s where the meat of the React app probably lives. I decide to keep going.

I open the src directory annnnnnd:

We’ve got directories named: Assets! Components! Routing! Screens! Styles!

What am I missing?

A lot. Because brand new dev. But! Not getting lost was the first step - I managed to navigate to the right town in Frontend Land. To figure out my way around town, I do what all devs do when we’re learning something new: turn to google.

I start looking up the names of some files and directories. I look at example React app structures. I open some of our files and look up types of functions I don’t recognize. Why? Because one of the hardest things about junior dev-ing is actually not having the vocabulary you need to articulate what your problem is, or really understand the problem you're given. Looking up every single thing you see that you don’t understand is time-consuming at first, but makes a huge difference, especially if you keep some running notes.

From there, I asked my coworkers - How do I do X? Where do I find Y? Why is Z? They answered my questions and in many instances pointed me in the direction of finding more information that I hadn’t considered before. From THERE, I was able to start handling my first few tickets. ADVENTURE!

Conclusion

I know the world wide web is indeed world-sized, and complicated. I know a lot of us have different jobs and different backgrounds. This really hasn't really been a how-to so much as a reminder to:

  • Stop.

  • Think about what you already know

  • How is it similar to (or different from) what you’re looking at (or looking for)?

  • Do you recognize the names of any files or directories?

  • Can you look up similar examples?

  • Where will you start when you need more information?

Being thrown at a new repo is scary, but you already have the knowledge you need to get going.

By thinking about what I’d learned in my bootcamp, I was able to more-or-less guess the overall structure of our repo. I knew I wanted to ignore the backend files (for now), and find where the frontend lives. I knew I wanted to find something with “screens” or “views” or components. By comparing our repo with ones I’d made with examples I found via Google, I was able to navigate to the right town on the repo map. Once there, I started to think about the pieces of information I was still missing and began hunting them down - at first, on my own, and then, via my coworkers. TEAMWORK MAKES THE DREAM WORK.

I've since asked myself these same questions when looking at new repos - either ours at work, or others I find in my research - and every time it gets a little easier. A lot of development is really just pattern recognition - you don't know what you don't know, but once you see and notice new things, you'll pick them up the next time, and so on. You're doing great.

Discussion (0)

Forem Open with the Forem app