Tips for writing better React code

Rockets taking off
Image Source Freepik

1. Use Callback Syntax of State Updation

When the next state of a component depends on the previous state, always pass a function to the setState and don’t set the state directly. Here’s some code showing you why:

Component breakdown

  • We have a state variable count
  • count can be incremented by two buttons
  • The Increment button…

Tips for writing short, concise, and clean JavaScript code

You must have seen the guy in the picture above. He simplifies everyday things — and that’s exactly what we are going to do with JavaScript in this article.

JavaScript has a lot of cool features that most beginner and intermediate developers don’t know. …

Find out how the most widely-used protocols for authentication and authorization really work

Cover Image
Photo by James Pond on Unsplash

We’ve all seen the “sign in with Google” and “connect to Facebook” buttons on websites and mobile apps. Click the button and a screen opens that says, “This app wants to access your public profile, contacts…” and asks you whether you want to give access. This is OAuth at a…

Spoiler: Not for TypeScript guys

If you are using React with JavaScript and not doing any type-checking, ask yourself a question. Are you writing clean and maintainable code? As the size of your application grows, the probability of bugs grows. Type checking can catch a lot of bugs for you.

React provides a built-in ability…

Setup a GraphQL server with modularization and authentication

Image source: Author

Most tutorials on GraphQL do not teach you how to split your schemas and resolvers just like you modularize your routes and controllers in a typical REST API or how to define and load type definitions from .grapqhl files instead of template literals. …

And things I wish all the developers follow

Image Source: Freepik

Do you also hate code that is not written well? Well, I really do. I’ve worked with many junior and senior developers who just write code to get things done. They don’t have any passion for writing clean, readable, and properly structured code.

Well-written code becomes more important when you’re…

Write less and do more with JavaScript

Image by author

With JavaScript, you can do one thing in many different ways. Also, JavaScript is evolving with the release of every new ECMAScript specification, adding new useful methods and operators to make the code shorter, and somewhere more readable.

After offering ten JavaScript tricks, I’ve decided to share five more tricks…

Useful hooks for extracting and reusing react code and JS logic

Hooks are great for extracting logic into reusable functions. There are a lot of npm packages offering built-in custom hooks. I personally don’t like to install some npm modules just to get the functionality that I can write myself with barely ten lines of code.

I’ve compiled a list of…

Structure your react application with bootstrap or react-bootstrap

Structuring your app with sass, bootstrap, and react is kind of tricky when you want to do theming, use bootstrap’s defined Sass mixins or want to define and use your own extensions with sass. This is a complete guide to structure your react app with sass and bootstrap.

Initial Setup

Create a React App

It is…

Perks of being a programmer

Photo by Aziz Acharki on Unsplash

People belonging to different industries may have different perspectives to see the world. However, being a programmer helps you a lot in performing daily life tasks smoothly.

Sharing few things that I really enjoy being a programmer. Programmers can do some tasks more efficiently than people from other professions.

#1 Logical thinking


Haseeb Anwar

I write about JavaScript and personal experiences. Subscribe to get a story delivered to your inbox every week —

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store