I finally learned React after years…

A man in a field looking at a mountain. Behind the mountain are large logos of Vite, TypeScript, and React.
A big challenge up ahead. Original photo by Kyle Johnson on Unsplash.

TL;DR

An update post that explains my past frustrations with the Web Dev Experience and what I’m doing differently now. I also set some goals for myself to achieve.

Update: Front-end is still not my cup of tea. Check the last section.

Introduction

I now have an Integrated Master of Science degree in Mathematics and Computing from the Birla Institute of Technology, Mesra. I spent 5 years in the institute, yet I insisted on using only plain HTML, CSS, and vanilla JavaScript for all my websites. Occasionally, I used SCSS and setup a simple tsconfig.json for plain TypeScript, but that’s it. I stayed far away from frontend frameworks like React, Vue, Angular, etc.

This does not mean that I have nothing to show for it. My homepage is built with no frontend frameworks, for example. It just uses Hugo. I built the Official V Blog in the same way. This blog that you’re reading is built with good old WordPress.

Why did I stay so adamant and why am I changing my stance now? Truthfully, I am not changing my stance. I’m still going to prefer plain HTML+CSS+JS for web sites. But when I need to make web applications, I need to consider browser engines as the Operating Systems for the web and use frameworks that make my work easier.

The Initial Hesitation

I despise JavaScript with all my heart. In fact, I dislike all dynamically typed languages (including regular Python without PyLance or mypy) that do not offer any sort of compile-time or at least pre-runtime type safety. This is because I have spent countless hours tearing my hair out over cryptic runtime errors that could have been easily avoided with type checking. Something tells me this is not a unique problem; Microsoft would not have gone and pulled another C# as TypeScript otherwise.

There was so much hurt and frustration that I kept my distance from it. Instead, I went off and dedicated my time to contributing to the V Programming Language. Yes, I’d rather work in a brand new, alpha-stage but well-designed programming language publicly released in 2019 than a language thrown together in a few weeks in the 90s. Isn’t that a big surprise?

When I’d run out of steam after working for V at a stretch, I’d relax by working on “lightweight” web projects with minimal JS. But what changed my mind? What convinced me to take the plunge write entire applications in JS?

The Solution

TypeScript extends JavaScript meaningfully and also occasionally inspires the addition of new features to JS. I consider the latter to as putting makeup on a pig, but I digress. Now what do I do with TypeScript? I wait for the web developer ecosystem to embrace it and develop tools with first-class TypeScript support. Like Vite, for example.

It’s amazing just how much better the developer experience gets when people develop with TypeScript in mind. It is trivial to scaffold frontend apps with Vite; just run the following command and answer the prompts appropriately:

npm create vite@latest

Then I navigate to the folders inside and change whatever I need to. Everything works out of the box without having to spend an embarrassing amount of time on the initial configuration. Any changes that I need to make can be done incrementally. If anything breaks, I can revert the configuration to the simpler working state.

Deno piqued my interest, but I choose to stick with NPM because the DX is fine. I might check it out later, when there’s a web server written entirely in TypeScript and preferring the deno runtime.

Current Situation

I have some time on my hands, now that my degree is complete and I’m waiting for stuff. So I decide to make use of this free time and be productive: I am learning “Modern Frontend Web Development”, or “Web Browser Application Development” as I consider it. I still maintain that Web Development is better applicable to people working on WordPress or stuff with a backend.

For the sake of speed, I am going to learn React first because there are plenty of high quality tutorials and other learning resources available for it, owing to its popularity. Once I have a few projects with React under my belt, I will try my hand at other frameworks.

Perhaps Svelte?

Recently, I’ve also had some decent practice with Express, MongoDB, and the SendInBlue email API when I deployed my updated Contact Form application on Render. I think I’m preferring TypeScript + NodeJS over Python + Flask (or Django).

Goals

In order to make myself accountable, I will write a few goals on this date: 9th of July, 2022. I will come back in a few months and add an update to this section near the end.

My goals for this web app learning sprint are:

  1. React Calculator
    • Improve Code Climate Grade
    • Increase test coverage
    • Make demonstration posts on Blog, LinkedIn and Twitter
  2. Simple User Management
    • Implement Front End and deploy demo
    • Learn Prisma and deploy Backend
    • Also make demonstration posts on Blog, LinkedIn and Twitter

We’ll see how much work I can get done before I get busy with other stuff again. Until then, I’ll ride the momentum and learn as many “modern” technologies as I can.

See you on the other side!

Update

I did not go any further than building a basic demonstration of what I could do with React Router. Also, I’ve been discouraged from writing client-side logic (business critical or otherwise).

It seems I was just not sold on the additional complexity of writing stuff in JavaScript (or related languages). I’d rather write stuff in Python and have it render HTML than let the users run JS on their devices to do basic tasks on my website. An interesting technology that I’ve come across is called HTMX. I’ve used it briefly and liked the fact that I could spend more time in a language/framework that I prefer rather than spend more time that reasonable necessary on JS. Sometimes, HTMX is all the JS you need and you don’t need to write a single line of JS yourself.

There concludes my experiments with React, Vue, and other front-end technologies. Unless someone pays me to use them, I will not be using them for personal projects. But I am glad that tooling has improved (take Vite, for example) and if I need to come back to it, I won’t be extremely frustrated.

Leave a comment

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.