Scribd
Upload
18 views2 pages

RR 4

Web dev

Uploaded by

Meher Krishna Thatavarthi
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
18 views2 pages

RR 4

Web dev

Uploaded by

Meher Krishna Thatavarthi
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
You are on page 1/ 2

Build Tools

In React-land, create-react-app (CRA) dominated the landscape for a few years. It


was a little revolution at its time, because beginners were given a ready-to-go
React starter project without having to configure a custom Webpack with React setup
anymore. However, over the last year Webpack became outdated rather quickly.

build tools

Vite is the new kid on the block when it comes to single-page applications (SPAs),
because it works with all the popular frameworks (e.g. React.js) for creating a
starter project. Implemented by Evan You the creator of Vue.js, it coins itself as
next generation frontend tooling. Under the hood it gains its power from esbuild,
which compared to other JavaScript bundlers is written in Go, and therefore bundles
dependencies 10-100x faster than its competitors (e.g. Webpack).

While Vite's ecosystem thrives with additions like Vitest (testing alternative to
Jest), other competitors like Turbopack by Vercel emerged just recently. Turbopack
is coined as the successor of Webpack, because it has been spearheaded by Tobias
Koppers the creator of Webpack. Because Next.js is still using Webpack and
Turbopack is developed by the same company, we can expect Next.js and Turbopack
probably being a perfect match in the future.

AI Driven Development
Will AI take a developer's job eventually? There is no answer to this question yet,
however, AI driven development became a thing in 2022. With the release of GitHub
Copilot, developers were able to get paired with a AI programmer in their favorite
IDE. It is as simple as writing code (or writing a comment stating what you want to
code) and GitHub Copilot will auto-complete the implementation details to its best
understanding.

But it does not stop here: ChatGPT by OpenAI is a more general language model which
takes care of programming tasks too. While you can ask ChatGPT free form questions,
it is also able to perform coding tasks. Many developers already caught themselves
using ChatGPT as StackOverflow replacement. In many situations, ChatGPT delivered
helpful answers (not always flawless though) when used as a search engine
replacement. Because the latter has to deal with lots of SEO spam (not only for
development related content), ChatGPT is seen as a viable alternative at the
moment.

"At the moment" is the important term here though. From a bird's eye view AI
created content can (and will) also harm the world wide web. Where manually created
SEO content was already a problem before, no one stops someone from producing more
auto-generated SEO content with ChatGPT. Will ChatGPT train on its own generated
content eventually?

There are a few noteworthy mentions that I don't want to forget but which didn't
make it into the listed trends: Tauri as a alternative to Electron for desktop
applications implemented by JavaScript/CSS/HTML, Playwright as alternative to
Cypress for E2E testing, Warp and Fig as next generation terminals, CSS Container
Queries as an CSS Media Queries alternative for responsive design, and last but not
least htmx as enriched HTML for creating interactive user interfaces without
JavaScript. Since I only gave a small summary here, I encourage you to check them
out yourself!

Anyway, hopefully I was able to provide you with a great overview of the status quo
in the web development ecosystem. If you liked the article, feel free to subscribe
to my newsletter below. I also intend to write more about a few of these
technologies this year, so if you are working for one of them, hit me up and we can
maybe collaborate on it.
A question that comes to mind for every web development beginner: How to set up my
web development environment as a web developer? The following guides have you
covered, because they will teach you how to set up a minimal web development
environment for MacOS or Windows. Even though you will start out with HTML, CSS,
and JavaScript as a web development beginner, learning React mostly comes right
after these technologies. Hence both guides come with instructions for React as
well, however, if you don't care about React, just leave it out.

Setting up your development environment all by yourself is your first challenge as


an aspiring web developer these days. It's challenging, with lots of searching on
the internet involved, however it will stress you which forces you to improve your
core skills and grow as a developer. While many people find setting up tiresome, I
hope it sparks some joy for you, because web development is all about tooling and
coding. There are many web developers out there, me included, who refine their
tooling all the time. So I hope you get excited about this process as well.

Continue Reading: My personal Mac Setup for Web Development


Essentially, there are two different philosophies that define your setup as a web
developer. While there are developers who prefer to have all their tooling in one
Integrated Development Environment (IDE), there are developers who prefer to use
multiple lightweight tools (e.g. editor/IDE, standalone terminal) and combine them
for their purposes.

Personally, I follow the latter philosophy (see guide above), because it gives me
more flexibility. However, for beginners to web development, I recommend using one
tool (IDE) to rule them all. The IDE (e.g. VS Code) combines everything that is
needed for coding (editor) and executing the code (integrated terminal).

Below you will find both guides for MacOS and Windows to set up a minimal web
development environment. As I said, if you are not interested in React (yet), just
skip these sections. However, even if you start out with just JavaScript, I
encourage you to check out React on the side:

Continue Reading: React setup for Windows


Continue Reading: React setup for MacOS
Both setups show you how to install the following tools. Here comes the gist of
what's needed and why it's needed:

Node.js and NPM


executing JavaScript code
installing JavaScript libraries
VS Code
editor to write code
integrated terminal to execute code
That's everything you need: Node/NPM + editor/IDE + terminal (also called "the
command line"). I hope these guides help you to get started!

You might also like