I’m going to share about frontend development environment that I’m currently using.

I recently use Arc browser and it becomes the most loved browser for me.
For beginner who are starting, I suggest to use Google Chrome first as its developer tools are more easier to access and have tons of knowledge sharing about the tools in internet already.

I’m also using almost everyone favorite code editor called Neovim. (Sorry I meant to say VSCode) and here are the VSCode extensions that I’m currently using.

1) Auto Rename Tag to rename automatically the opening and closing tag of the HTML and JSX element.

https://marketplace.visualstudio.com/items?itemName=formulahendry.auto-rename-tag

2) Error Lens to show the error directly at your code editor.

https://marketplace.visualstudio.com/items?itemName=usernamehw.errorlens

3) ES7+ React/Redux/React-Native snippets to generate the functional components, class components by using the short handed words.
https://marketplace.visualstudio.com/items?itemName=dsznajder.es7-react-js-snippets

4) Image Preview to preview the image directly in your code editor. https://marketplace.visualstudio.com/items?itemName=kisstkondoros.vscode-gutter-preview

5) Of course, Github copilot and copilot chat to embrace the AI technologies.

6) Material Theme and Material Theme Icons to decorate the VSCode.

https://marketplace.visualstudio.com/items?itemName=PKief.material-icon-theme

https://marketplace.visualstudio.com/items?itemName=Equinusocio.vsc-material-theme

7) Prettier to format the code.
https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode

8) Tailwind CSS IntelliSense to autocomplete tailwind class.

https://marketplace.visualstudio.com/items?itemName=bradlc.vscode-tailwindcss

9) Todo Tree to support to note myself about TODO: FIXME: so that I won’t forget about the comments.
https://marketplace.visualstudio.com/items?itemName=Gruntfuggly.todo-tree

Happy Hacking!