How Next.js helped me understand react framework

Struggles from strongly typed to weakly typed

Griffiths Sibeko
Developer Circles Cape Town
4 min readFeb 10, 2019

--

My first stab at programming was when I got to learn C# and got a solid foundation. Then I moved to JAVA which the learning curve was something bearable. I have heard so many great stories about ReactJS and most conversations at conferences and meetups would touch on that.

Such conversations kept fuelling this drive to read more and take a stab at it. The reading up went well and came a time when I have to start building. At first I didn’t want to build something that will take some time to give me an idea of what I am getting myself to. Also mostly on the Object Orientated Programming we often joke about going party hoping to all the new javascript framework launch parties

My first try was a combination of what the hell is this thing? Do I really have to use this CLI thing? Why can I just not go File > New Project (Yes I am Visual Studio spoiled). It took me some time to get used to that idea and this was after I told myself that it is okay to google some commands here and there. There was one thing that I kept struggling with. Coming from an Object Orientated Programming background and taking a stab at react I mostly struggled with how everything just works together.

Comes Next.js

nextjs.org

This post is not about unpacking nextjs but more on how their resources were easy to follow for a beginner like myself. To understand more on the benefits I would recommend this post on Codementor.

I stumbled across the Next.js site by accident, and I am glad I did. The website looks very nice and clean. The landing page got me there but the learn tab kept me there.

Most of the sites I frequent to learn it is more learning and hardly test on what you are learning. Maybe this is one of the reason why I have a lot of unfinished udemy courses. Once I get the idea of what the udemy video is relaying I stopped. Granted, some of the courses there have exercise files but the course or learning experience is not centred around those.

The getting started part

To get started with the learn section on nextjs you will need to login using your Github profile and this gives nextjs the ability to keep track of your learning progress.

On the left side bar you get to see what you will be learning and also your point score (this can work well for the super competitive). As you can see I have not finished the deploying bits and I am not on the excelling part of the learning.

To my surprise each section is short and the outcome is clear. As I went through the tutorial or learning experience, I kept laughing at myself thinking about all those times where I will look at reactjs or es6 tutorials and will end up closing that tab and closing the terminal and open Visual Studio and continue with some good .net core.

nextjs subsection progress indicator

Each section has subsections with its own weight to the point scoring and that gives a little bit of idea of the effort (this is just my observation and not what nextjs says).

Once you get to the part where there is something which works or some visibility on the learning there is a small but quite insightful quiz that you have to compete at the bottom

The nextjs quiz

I am getting really comfortable with nextJS and will write more on moving from OOP to functional. It will take some time as I still have to convince myself that I am not loosing keystrokes by typing npm run build on the console instead of clicking a button on my IDE or just one hot key.

--

--