This is a react / node based article so if otherwise, this article may not be the one, but feel free to help yourself here if you catch something interesting….
What I use —
- React Js
It’s the norm for me. I start with Vite-React templates. We also have NextJs (helps with SEO), Remix and many many more. Another one is React-App-Rewired with CRA
And I don’t prefer using CRA (create-react-app) as it is.
Typescript is overkill and thats what I will stick too. If one knows the react way and appreciate JEST and ESLINT, nothing will ever cause a problem.
- Tailwind CSS or other similar alternatives
Don’t end up writing all the css.
Writing tests is a good practice for long term project
- Cypress (not necessary)
It a good tool to automate testing the UX.
- Linting — ESLINT
Always use eslint. Prettier or editorconfig files should always be there to keep linting consistency
Automating the testing and linting before every commit is good enough
- State Management — ContextAPI
ContextAPIs are good enough for global statement management, and redux is overkill until and unless you have a genuine reason to justify it. And if you can then you are experienced enough to not read this blog.
- Sass or Less
preprocessors are good but one may need it if the project is big as bootstrap css may not be enough
After using many libraries, this is the only library I will use for API calls if I had to start a project
It has a lot of usable functionalities which will help keep your actual source code short and precise by abstracting most of the logic which one has implement in all possible projects as helper functions
- React Query
Its an awesome library and if one is using it with context APIs, I can’t see a use for libraries like redux, it’s alernatives, until justified.
- UI Library (not necessary)
Libraries like MUI, AntD, etc… are awesome but I dont think we need them unless required. If I know I may end up creating a custom UI library in the future, thenI will definitely add it to my package.json from day one.
“I use Antd (with Less as preprocessor)”
- ChartJs + React-ChartJs-2
Drag and drop
- Formik and React-forms (it’s good)
For implementing forms. Some UI Libaries also have their own form components which may or may not use the same from behind.
- Apollo for GraphQL
I have never used anything other than this for Graphql and its good.
For 3d rendering. Server side rendering can cause issues with this but can be avoided using dynamic imports and client side rendering.
- Netlify, Vercel or Hureko
- AWS and digital ocean
for virtual server. Azure is a tough nut to crack.
If you have an old unused system like a PC, laptop or even a rasberrypie board lying somewhere in the house + a stable unlimited internet connection, there are great article on how to use your own system as virtual server.
- Github Actions
This is a good entry into CI/CD as a beginner if you want to use your own virtual server.
Its a good tool in itself and will definitely abstract a lot of backend code for you.
- Mongo Atlas
free online mongoDb clusters
Another great tool as an all in one solution for ORM. Sequelize is another recommendation if prisma is not the right one for you.
It’s a service you may have to understand a bit when learning with virtual servers
for process management, try it once and you will get the gist of it
I will not go into dockers, Lambda functions, Google Cloud and other stuff as even I am not that experienced in it.
Do give this a clap if you find this helpful. And please share comment incase I am sharing wrong info, missed something out or anything else…….
THE LAZY DEVELOPER