DEV Community

Elwin Jyothis
Elwin Jyothis

Posted on

What are web stacks and which one to use?πŸšΆβ€β™‚οΈ

As a web developer I have got stuck in this loop of choosing the best web stack many times! It wastes a lot of your precious time, let's fix that. I'll help you to choose the right web stack for your project. But wait! What is this web stack? πŸ€”

What are web stacks?

A web stack is a collection of technologies, softwares or programming languages used collaboratively to build fast, feature-rich and reliable web apps. Each tech in a stack is responsible for handling a specific part of your web app. Lets say you need to put some headings, paragraphs and render some images onto your browser. We commonly use HTML to define these templates. Now, what if you want to change the color of the headings or the size of the image? You can use CSS to define some rules for the HTML templates. Here we can see how these two languages or tech is working together to render content onto your browser, isn't it amazing! Well, it doesn't end here. What if you want to change the image in your HTML template when a button is clicked. You can use JavaScript to handle this job. There are more coming on the way πŸ˜‰

The most commonly used and industry standard web stacks are the below:

  • MERN (MongoDB, Express JS, React, Node JS)
  • MEAN (MongoDB, Express JS, Angular, Node JS)
  • LAMP (Linux, Apache, MySQL, PHP)
  • Django React
  • Oh dear this is a long list....πŸ™‚

NOTE: It is not at all necessary to strictly follow these set of web stacks. You can use any of the techs in the market to build your amazing web app.

Which one should you use?

I know, there is a lot of web stacks to choose from and that's why most of the beginners(myself too) get stuck in this never ending loop πŸ˜΅β€πŸ’«.

After reading that screaming note above, you might be thinking, why do these stacks exist if we can just use any technologies of our choice together. Well, it is indeed performance based. Some technologies work pretty great together and some don't. For example, the reason for developers choosing the MERN stack is mainly because of the high performace of the React framework(React is only responsible for rendering dynamic webpages by combining JavaScript and HTML) and the advantage of no-sql mongoDB(mongoDB is a no-sql data storage and management solution). Just like this, each stack has its own pros and cons. Selecting a web stack for your webapp should be based on what features you are going to implement.

Let's try selecting a web stack for a project.

I am asked to build a webapp to store and manage the data of employees of a company. It should also have a great dashboard for the administrators to access and manage the data.

In this case, we need the following features:
Everything stated below are purely personal opinion, you are free to use any technology you prefer.

  • A frontend which can render webpage dynamically.

    I can use React, Angular, Django or just the vanilla JavaScript, HTML, CSS combo. I would go with React as it is fast, quick to develop, it is component based so I can reuse my code.

  • A language or tech to handle different features such as Creating employee, deleting, updating and reading data from Database.

    I have options like PHP, Python, Golang, C# and many more. I usually prefer Python and use the amazing Django REST Framework to create restful API to handle these tasks.

  • A Database to store and read employee data.

    Here options are dbsqlite, MySQL, PostgreSQL etc...I prefer dbsqlite for development purpose, as it is the default database for Django and doesn't require any additional setup. For production I rely on Postgres DB.

Summing up all we have a stack which uses React for frontend, Django for backend and Postgres for Database.

There you go, that's one way to select an ideal stack for your webapp.

I hope you enjoyed and learned something new πŸ˜„. All the best for your future projects.

Thanks for reading, have a great day βœŒοΈβ€

Stay tuned for explained blogs on React and Django!

Top comments (0)