My Journey from PHP & Wordpress to FullStack Javascript

For my first fullstack javascript app I built, Power Todos, a more advanced personal todos app than the typical beginner todos app. It tracks tasks for every todo and can store notes for every task. It was built with React, Express, Node, Postgres. It uses Redis, Redux, React Router and more…

My Background in Programming: PHP, JS, jQuery

I am a php developer, as much as one can be coming from Wordpress. I have built very large, complex plugins for Wordpress and hacked the heck out of its ecosystem for nearly fifteen years. I am proficient with MySql. I have had to optimize performance for websites and networks of websites and am well versed in SQL Stored Procedures and writing proper queries.

And Then There Was Node

As much as I have used PHP in the past, I find it frustrating and working with Wordpress has made what remains of my hair jump right out of my head. Plus, I know Node is the future and I refuse to be left behind.

React Redux

Redux was the first difficult JS concept to grasp. This is when I realized, after frustration comes progress. I know that if you give up every time you get frustrated, or think you are just not smart enough to do this whole programming thing, you will never make it. So I gave myself a few days to let my brain fully understand actions and reducers. I left the computer several times to go explain the concepts I learned to my wife. She did not care, but that was okay. I found I needed to step away from the computer and explain concepts out loud, from my head, in order to fully grasp them. And she even helped me a couple times when what I said didn’t sound to her like it made sense. Explaining it to her forced me to truly understand the topic. Not that she would remember anything I told her, but I did find that when I was able to tell it to her so she got it I knew I got it.

Postgres & Knex

Fortunately, I already have a good understanding of SQL so Postgres was easy for me. The biggest thing I actually learned is that it is a bit too simple of an SQL implementation for my taste. I don’t like that you can’t do little things like reorder your columns after you create a table. Not really a big deal, but it made me realize the lack of control available to Postgres users. I also wasn’t able to change a column’s type after it was created, instead, I had to delete the column and add it fresh. But what happens if you want to change the type a year into the app? You can’t just delete a column and re-add it again. Again, I’m sure there is something I am missing here, but I couldn’t find it.

Firebase/Firestore

I have not used this extensively, but the concept of having data live update from one screen to another is thrilling! This makes me excited for the future, and makes my brain churn with ideas. However, most of my brain is thinking how I can implement Firebase with some of my previous PHP websites and most of the answers that I found were that it can be done, but there were going to be limitations because Firebase was not really built with PHP in mind. Thus, another reason why I have to accept that Javascript is the future.

Post Course Work : My First Fullstack JS App

After the courses I went out and built my first fullstack javascript web app, Power Todos. I built it because I needed it. I had so many todos in my mac Notes app and so many Tasks for each todo, I knew I needed a better system, and building a fullstack todo app would be the perfect exercise for implementing all of my new knowledge.

PWA, Serving .txt, or .html Files, & HTTPS

My Power Todos app became a proper progressive web app, which meant learning how to properly setup a proper manifest.json file. In PHP I always wanted my websites to also be PWA’s but the learning curve seemed too steep. In React, this was truly easy. Just adjust your manifest.json file in the public folder, add the proper icons using this cool generator, and make sure your site is using https instead of http (plus a few other small thing.)

The Unknown: Command Line & Git

Before I started learning javascript a couple years ago I knew nothing of the command line. I used Sublime to write code, but I never used Emmet or other platform specific plugins to speed up the process. I uploaded files via ftp software like CuteFTP and Transmit. I never had to manually restart a server or SSH into a remote server. I mainly bought dedicated servers or virtual servers and used hosting company tech support to handle networking issues.

Testing

One of things that annoyed me the most about this new Node world was having to write manual tests. Hack Reactor was big on this when they made us rewrite the underscore library so I knew the importance, but I hated the process. I never understood why you needed to waste your time writing so many useless tests and PHP did not push test driven development at all.

Sessions

The very last thing I added to Power Todos was session management. I tried doing it the same way I did in php, which meant storing the sessions on the server and authorizing users based on cookies sent from the frontend. I implemented this system in my express backend using express-session and after a full day of editing I finally got it to work… on Chrome only!

Going Live: Heroku, Docker, docker-compose

I spent a good amount of time learning about Docker. I then set up an image for my Power Todos backend. Then I setup Docker Compose which allows you to combine several Docker images so that you can deploy your entire backend from one Docker file. I was excited about this technology because I understood the significance of simply running one command and having the whole backend up and running without the need for local machine setup.

Things I love and things I hate

What I really loved about Javascript and especially the Node, Express, React world, was writing the code. It is so clean, so easy to keep organized, it is like a breath of fresh air. It is so logical once you understand the ecosystem and most of the documentation for different libraries is easy to find and very descriptive. That said, that was only true for the big libraries. The smaller, more unpopular libraries I had to dig through source files to understand what was going on. But in all, I loved the ecosystem.

Working on a New Codebase

You are not going to look at something and understand it automatically. Don’t think you will ever get to this point! Especially if it something new that you have never looked at before. No programmer, no matter how expert they are can do this like magic.

Next Steps

developer. entrepreneur. student.

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store