Land a React Job: The lazy way

Hang on, lads. I've got a great idea.

So you've run out of Netflix TV shows to watch, YouTube algorithm is now showing videos like Man eats 87 SpongeBob stickers in an alley and you learned a little bit about that Facebook JavaScript library while in lockdown?
Then it's time to REACT and land a job so you can buy that AppleTV subscription that will get you fired, but eh, at least it will last few months because they’re kinda killing it lately with movies and tv shows.

I choose a lazy person to do a hard job. Because a lazy person will find an easy way to do it.
- Bill Gates

Chapter One: El Clásico

You are gonna build ...wait for it...wait...just a little bit... app that fetches list of data and displays it to the user in a nice way. Yeah the classic I know, but the companies really dig it, especially if you use some nice css library and interesting API with it.

Lazy steps:

1. Go here
2. Choose a crypto or games & comics API with Auth = NO, HTTPS = YES, CORS = NO (if you're feeling extra productive, you can risk it with unknown)
3. Follow along this kinda video and just change API specifics to yours
4. EXTRA: Try out the API you chose with Postman. Just paste the URL into it and it's just enough experience that you can add it to your CV. And you guessed it, the companies really dig it

Chapter Two: Graphs

Take a piece of paper, grab a pen and draw this:

This graph represents principle of Least action on the most complicated equation in the world. But also it's the symbol of our lazy, the least possible action needed mission. So let me introduce you to another graph, GraphQL. It's newer, better, faster and most importantly sounds smart and fancy, query language for APIs. To summarise even more, it replaces REST API.

Lazy steps:

1. Read and learn this. Probably the most boring part of our mission, but JUST DO IT!
2. Start a new react project, choose GraphQL API and install Apollo Client
3. Apollo Client gives your React project the power to use GraphQL queries. useQuery hook is all you need, so learn it here, read to and including Inspecting loading states
4. This project in itself is the same as the first one, just with different API endpoint and instead of fetch(), we implement useQuery(), so just reuse the logic ;)

Chapter Three: The Next Episode

“The Next Episode” was released as the third single from Dr. Dre’s 2001 and features his frequent Dogg Pound collaborators Snoop Dogg, Nate Dogg and Kurupt. The single peaked at #23 on the US Billboard Hot 100 chart, while achieving platinum status.

Single that will make our status platinum is called Next.js. New, shiny, talented kid on the block, wonderkid, the NEXT big thing. It's the final touch to our mission. It will leave your interviewers speechless. Next.js is a minimalistic framework for server-rendered React applications as well as statically exported React apps. If it sounds complicated, lazy step one will explain all.

Lazy steps:

1. Watch this video by Fireship
2. Start a new Next project with yarn (nice bonus touch)
3. Recreate "Chapter two" project in Next
4. Go to Vercel and sign up with your GitHub account
5. In Vercel, click New Project -> Import Git Repository, choose this project and deploy it...yeah, it's that easy :)
6. EXTRA: Vercel deployment also works with CRA projects, so deploy the rest of them
7. EXTRA: Enable Vercel analytics for your Next.js project, it's just a click of a button, but hey, you used advanced analytics in your projects ;)

The End

Carl Hanratty: How did you do it, Frank? How did you cheat on the bar exam in Louisiana?
Frank Abagnale Jr.: I didn't cheat. I studied for two weeks and I passed.
- Catch Me If You Can (2002)

Don't lie to yourself, these are the things you now know besides React, HTML and CSS:

• npm & yarn
• fetch API, test API with Postman
• GraphQL data structure and queries, Apollo Client for React, useQuery...
• SSG, SSR, Next.js, routing
• Vercel, deployment

Go on now, apply for the jobs, get one, earn paycheck or two, buy consuming content and subscription, get fired and repeat the process :)