Web Development: What One Can Learn From My Experience Trying to Make a Web and Mobile App

In June 2019, almost a year ago now, I started a web project. It’s still a project in development and my goal is to publish a web, ios and android application within the next month. I wanted to take this opportunity to publish things I’ve learned and mistakes I’ve made so that someone who is looking to start a similar project with the same goals as mine(app for web and mobile) can perhaps get a headstart, learn and get a clearer idea of what to expect from initial choices made in terms of selecting the starting stack and some trade-offs for any choice that is made.

When I first did my initial research, I didn’t really have a starting point. I have worked on different parts of larger web projects in different languages, but the challenge here is that I was taking responsibility for the entire stack. My project has many social media elements to it, and so I did a search on that front and came across this course: https://www.udemy.com/course/make-a-social-media-website/. I bought the course and that is where my starting stack was selected.

The stack in this course is what is considered a very legacy combination of technologies. It is based on some standard languages, that are consistent throughout any stack that one would end up using, legacy or something newer, such as html, css and javascript. The main differentiation factor here is that this stack is php on the server-side and the structure is set up in such a way that one would render html code to be generated by the backend php scripts rather than be separated. It is said that the best practice is a clear division between the backend and the frontend, which is something that you can do with php, but not something that the course followed. The frontend and backend code all exist in the same file and it intermingles a lot. An example of what I am talking about can be seen in this video: https://www.youtube.com/watch?v=3T8bp9DlypU. I understand it is annoying to go and follow along with a coding video (or maybe you like it) but this highlights a very core concept with php in terms of how to set up the structure of the code.

I can talk about php for a long time, it is a great language for web development purposes. I would even recommend it above any other language for the backend purpose, but I would highly suggest keeping the division between front and backend and NOT to render html code directly from php. Meaning there should be no echoing of html from the php files. That is something that I wish I had done, since when I wanted to later switch to newer technology for the frontend side of my application aka Angular, I had to rewrite the vast majority of the code. This rewriting could’ve been avoided had that clear division existed.

Today, if you’re looking to start a web project, you would in the vast majority of cases want to use a newer technology such as Angular. The problem with that is that if you don’t have a background in development, and a clear image of the different processes that need to take place and how data needs to be passed between the different parts of the stack, there aren’t many resources that fundamentally highlight those concepts with something like Angular or Vue. There is a learning curve associated with those technologies hence hard to start with that.

What you get from using these technologies?

Better performance, less code to write, and you don’t have to worry about unforeseen development potholes, as much, as those are usually taken care of for you.

It honestly is much more fun to start working in Angular, albeit once you get the hang of it. Setting up a legacy system like php and other technologies I talked about are very simple to set up and get up and running. To set up Angular and how the modules and components are working, my experience was one of a lot of guessing and checking, and it was frustrating. Once, however, that curve is conquered, the quick rate of development is fun and motivating, whereas working with php and javascript and it’s a simple format, one literary has to take into account a set of scenarios that could happen whereas using Angular modules, one does not have to worry about that.

Conclusion

If you are in a position that I was in, looking to start a project with the end goal of delivering a web and mobile app, I would first look to start an application using native technologies, such as php and html, but I would make a VERY CLEAR distinction between backend and frontend functions. Once I begin to feel comfortable with how data is passed back and forth between the stack, then I would look to integrate a SPA of choice (Angular, Vue, React). I wish you the best of luck! It’s a great learning endeavor

Scaling @rubiic - an open journaling app :)