12 Rules and Approaches of Code Writing for Beginners

Authors
Mariia Marchenkova
Software Engineer
@
Callstack

Callstack developers periodically dive into projects with other teams. If you have a project set up, all you need is to dive into coding and add new features. Wonderful, isn’t it? Nevertheless, sometimes it does not happen to be so enjoyable, and here is why.

First of all, developers read more code than they write. The project may look very nice from the user side, but the same still cannot be said about its codebase. Like a cross-stitch, you see an awesome front side, looking on the back you have no clue what it should be.

This article will provide you with a set of 12 (in total) rules and approaches, which will make your code as marvelous as the result you are getting from it. The rules are divided into three aspects of coding:

  • Readability
  • Consistency
  • Testability

and I hope that they will occur helpful in your professional coding path as they were in mine.

Let's start our journey into a beautiful codebase! 🚀

Readability

This line does not take much effort to read, isn't it? Butwhatyoucansayaboutthatone?

Long names, deep statements, unclear structures are the developers’ nightmares. Seeing the code for the first time should not take much effort to be understandable. If it takes, it has a serious problem with readability and it should be fixed. Let's see how we can make our code more readable:

Stick to one code structure

Different developers prefer different structure patterns. First of all, decide which one works best for you and your team members. Having several variations of structure in the project will create misunderstandings. This rule should be applied not only to the code but also to the folder structure.

Separate code into blocks

It is easier to eat pizza piece by piece, rather than all at once. The same is with the code blocks - split them into smaller chunks, instead of having a large bundle.

separating code into blocks in React Native

Remember about naming

Code cannot tell its reviewer what you've had on your mind while creating it. Naming speaks for itself. Do not make people waste time looking for the context between lines and files. Simple and straightforward naming is the key.

screenshot presenting code naming

Avoid deep nesting

The deeper you make the code - the harder it becomes to follow. Deep nesting makes you go back and forth to find missed pieces. It is a good exercise for your eyes, but a bad habit in coding.

avoid deep nesting in writing a code

Use tools to format the code

Thankfully, you don't need to format code manually. It takes you a few steps to get readable code - choose your favorite editor (we recommend using Prettier) and set up config. The tool will make formatting faster and easier.

Consistency

Do you remember working on your project and coming back to it in a while with a 'What I was trying to do here’? Every developer had such a facepalm moment.

One of the main reasons for that is the problem with the code consistency and how we had grown in programming. The same can happen to the new project members if the team has not decided on the code structure and rules. You start researching and code debugging, which takes your development time. To avoid this, follow these rules:

Code should look like it was written by a single person

If you or your team do not have a style guide - create it, if you do - follow it. Simple as that.

The code will probably live longer in a project than you will work on it. Teams are constantly changing. Therefore, do not create challenges for future development, take care of codebase style, and follow the rules.

Don't Repeat Yourself (DRY)

The same piece of code should not be repeated - programming was not created for that.

Separate duplicated code into unique parts. The idea is to reuse things just by calling them, not copying and pasting all over and over again. Same as humanity nowadays, we are on the way to get rid of plastic bags in favor of reusable ones.

Check if new things fit the whole picture

Keep track of just added pieces. We know that the implementation of new functionalities to the existing environment can be difficult, but do not forget about making things not only work properly but also look suitably together.

Testability

You cannot assume that your code works perfectly without testing it. Tests make work undoubtedly easy. Testable code says that you are on the right way!

Each function should have a single purpose

Let's say you want to get all users from the database. And you want to thank them for being registered longer than a year by giving a new golden status. We do not have any queries for such a case, so we will implement it manually.

each function should have a single purpose in react native

We mixed get and post in one method, which makes it significantly hard to test. To prevent such complexities, they should be separated:

screenshot presenting async function

Do not mutate

Mutation is the process of changing the original data. With mutation, you are updating an object, which is used in other places. As a consequence, you are left with an unpredictable code. If you will cut an apple in pieces, you would not be able to put it back together, it won't be the same anymore. The process with data mutation goes similarly. To escape it - use unique values for separate tasks.

Avoid side effects

I assume that everybody knows what are side effects. In coding, for example, side effects are methods, which return different output for single input or whose output depends on the global state. They make code complex and harder to test. You can isolate them from the rest of the code to prevent misleading.

Follow the Test-Driven Development (TDD) approach

What your implementation process looks like - you start with code writing, do some tests on it, and update tests till the light is green. But what if the problem is not with the test, but with the code itself?

Test-Driven Development (TDD) is the development workflow, which goes in another order:

  • Start with simple code
  • Write a test on this small piece
  • Make test fail
  • Refactor the code
  • Make test pass

By following this approach, you can obtain all possible cases on how your code works. That would be a lie saying that I am using TDD in daily work, but I am a big fan of those who do. Nevertheless, you should try it to feel the difference. And who knows, maybe this process will be much suitable for you!

Insights

Learn more about Scalability

cover

Jul 16Podcast

Structure Monorepo for Speed, Scale & Sanity

Discover how Nx empowers teams to build and scale monorepos without losing their sanity, from selective testing to AI-powered workflows.

Event Cover

Sep 7Talk

The Invisible Architect

Learn how communication shapes your app development, from code to design. Discover React’s role and leverage Conway’s Law for success.

cover

Dec 27Article

Why Is It Important to Always Run The Latest Version of React Native?

Upgrade your app to the latest version to get more features and better support. Find out more in our article.

cover

May 28Article

Building Component Libraries for React Native Apps

Satyajit Sahoo shares insights on building component libraries for React Native apps.

cover

Nov 23Article

React Developer’s Everyday Struggle - Extending Big Applications

Do you struggle with extending bigger applications? Check the solutions we arrived at while working on the EEDI app. Contact us to discuss your project!

cover

Mar 1Article

Reusable React Native Components

It’s pretty hard to find simple methods to customize components that could be reused within the app. This article will help you create more efficient code.

cover

Feb 8Article

Four Tips to Write Maintainable React Components

React - the declarative UI framework that simplifies development. Read our articles for more details.

cover

Mar 19Tutorial

The Hard Way vs. The React Native AI SDK Way: Stop Writing Custom Modules for Every Model

Learn how React Native AI uses a unified provider model to switch between cloud and on-device LLMs without rewriting application logic, enabling reliable AI experiences online and offline.

cover

Mar 12Tutorial

Build Smarter Apps: Tool Calling & AI Orchestration Explained

Learn how on-device models in React Native can call tools, interact with external APIs, and return structured outputs you can use directly in application logic.

cover

Mar 5Tutorial

MLC LLM + React Native: On-Device AI Without the Pain

Learn how to run third-party on-device LLMs in React Native using MLC LLM. Choose your models, run them efficiently across platforms, and keep a unified JavaScript API with React Native AI.

cover

Feb 24Tutorial

Intelligent Fallbacks with Apple Intelligence in React Native

Learn how to use Apple’s built-in Foundation Models in React Native apps, reduce memory usage, and enable fast, fully on-device AI with React Native AI Apple.

cover

Feb 10Tutorial

What Is the React Native AI SDK? A Complete Intro & Quickstart

Learn why on-device AI matters for React Native apps, how local LLMs behave offline, and what problems React Native AI is designed to solve from day one.

cover

Jan 29Tutorial

Implementing an Android TurboModule with Kotlin

Learn how to implement a React Native TurboModule on Android, from the TypeScript spec and Codegen to the Kotlin implementation and package registration.

cover

Jan 19Tutorial

Working with Different Threads in Swift TurboModules

Learn how JavaScript, native module, background, and main threads interact in React Native TurboModules, and how to use GCD queues to run async work safely in Swift.

cover

Jan 9Tutorial

How to Add Type-Safe Constants to Swift TurboModules

Learn how to expose typed, immutable constants from a Swift TurboModule using Codegen, and get full end-to-end type safety between native and JavaScript.

cover

Dec 30Tutorial

Adding Event Emitters to Your TurboModule in Swift

Learn how to emit native events from a Swift TurboModule and subscribe to them in JavaScript, including proper memory management and Codegen integration.

cover

Dec 22Tutorial

Writing Your First TurboModule in Swift

Learn how to build a fully working TurboModule in Swift, integrate it with Codegen, and bridge it through Objective‑C inside an Expo app.