As promised in my last post, I will take some time to delve into
React concepts and procedures in my next few posts – and I will attempt to pay attention to things that I felt were difficult to grasp when I first began learning it.
I want to focus first on the concept of a component. Components are the heart of React. At first, they can seem like something esoteric – especially when you see them implemented with JSX, which can also be startling to newcomers. Nevertheless, two things should help keep us grounded in our journey of React.
The second thing to remember, which will be a focus of this post, is that React components are simply reusable pieces of code, much like functions. In fact, they are quite often written simply as functions. Creating a component entails giving it its own .js file and everything. This means that it is very modular, making it easier to visualize projects in the long run. While it can be difficult to justify having to flip through so many different files (is this Object-Oriented programming, or what?), I suppose it could be argued that it is a better alternative than scrolling through hundreds or thousands of lines of spaghetti code. But I digress…
I ended 2017 with my first fullstack Node project.
2018 is off to a rousing start, as I have jumped back to sharpen my frontend skills by learning React.
jQuery). So what was special about this one? Well, one major difference is that
React is much quicker and lighter, as it uses a virtual DOM to update sections of a page independently (these sections are known as components – more on this soon).
After soliciting feedback for my MVP (and a bit of a tussle with Travis CI as I cleaned up my testing regimen), I can now present the new and improved Studyficient!
It feels great to have built something which utilizes client-side and server-side technologies!
The story of this app reads much like learning web development in general – a plot involving learning one skill and quickly finding out that one technology turns into
seven more another. For Studyficient, Node, Express, and MongoDB were the three main technologies. Along the way, I encountered the likes of Mongoose, Mocha, Chai, and Passport - as well as a few new services to utilize continuous integration (Travis CI) and deployment (Heroku).
Additionally, the E (Express), the incredibly efficient Node.js framework, helps to construct routes with relative ease – which brings me to another major similarity between frontend and server side: both have a myriad of acronyms by which they describe their modes of operation and common practices (if you’ve read my posts up to this point, you’re probably sensing a theme here…)
Greetings, once again, esteemed reader!
I return to you after a lengthy sojourn into to the server-side aspects of web development!
It was an interesting, exciting – and at times, rather frustrating – endeavor; but thankfully, I have something to show for all of my efforts!
I have come a long way since my last project involving frontend API calls.
My latest project actually involved constructing my own API – complete with a database to store information, including user accounts. This process also entailed establishing authorization with JSON Web Tokens (JWTs) and utilizing Passport.js.
More on the specifics later!
For now, I have another MVP for you to test out!
Go ahead and take a look at Studyficient!
If you’d like to test it out without creating a new account, feel free to log in with
It sure is a pleasure to write this post - mostly because I am stoked on the completion of my latest project, a comprehensive frontend web app!
Please check it out and feel free to let me know what you think!
Be There - For Your Career
This one really gave me a chance to practice my coding chops! But honestly.. what would an undertaking like this be for an up-and-coming web developer such as myself without a couple of good ol' fashioned lessons along the way?
Perhaps the greatest lesson working on a project as large as this (relatively speaking, of course) was the value of planning out a project design before jumping into the code. Part of this lesson also pertained specifically to APIs: I had to find one which would provide me the information I needed - and (this is the crucial part)
in a useful way.
"APIs, AJAX, and JSON - OH MY!"
I channel this sentiment from The Wizard of Oz in order to display my initial fear of more new terms being hurled out as I began to learn asynchronous client-side apps. Thankfully, this fear has since withered away as I gained quite a large amount of knowledge in using those very components over the past few weeks by building my latest app.
Among other things, some have speculated that L. Frank Baum originally wrote The Wonderful Wizard of Oz as an allegory for the debate about bimetallism at the turn of the twentieth century. This makes me think that maybe there could be a new interpretation for the internet age… (For example, in lieu of 'follow the yellow-brick road!', 'follow H-T-T-Protocol!') Yikes…how’s that for a digression?