Getting Started With Developing Web and Mobile Applications
In this post, I address Wasim’s question about getting started with developing apps and programming for a living
Being a developer who now works in a tech focused, full stack role, I am always curious about ways to further develop my skills. So when someone reached out to me about ways to get their own skills up to date, I had to reflect back on my own journey, as well as others that I have seen rise from knowing nothing to being able to design well thought out, react-based applications.
For example, I've got a friend who studies accounting and didn't have much of a programming background. He's now building his own apps, although at a basic level and is amazed by his own capabilities constantly! In this post I’ll relay how he got to this position.
You have to set yourself small projects and deadlines for each one.
He wanted to build apps for desktop, web and mobile, so I suggested he learns how to build applications on the web, which can be easily translated to all platforms. However, you can also apply this to master iOS or Android development as well.
Developing Web Applications
HTML and CSS
With web apps you need to start with basic HTML CSS and JS. Id suggesting getting a feel for it with a YouTube tutorial on making a website with bootstrap and then making sort of like a resume. You can see mine at http://deeplydiligent.github.io/
You will need to learn bootstrap for making your websites mobile compatible. You may find it useful to use a template at getmdl.io/templates.
Somewhere between this stage and the next, it is also important to familarise yourself with CSS selectors, and how to use them to change the look of any element on the web page. It is crucial that you are able to place any element in any place you desire before you proceed to JavaScript.
JSt Do It!
After this, do some simple JavaScript. Make a calculator app (can be a grade calculator or a financial calculator) make sure you've got a good grasp of how js works. You should also use JQuery at this stage to update contents in the DOM (on the website). Learn about event handlers (those things that tell you to update the calculation when the user presses calculate button) and loops.
Intro to Backend
At this point, you will find it useful to start learning a backend framework like PHP. Pick an app that you've wanted to make that requires people to fill out a form, and then give analytics on the data that is obtained. For example, it could be a timetabling system where you let a user pick the times that they are free, and give them a link to share with others. Others then go to this link and select one of your available times. Once they pick a slot, that time is marked as reserved and noone else can book that time slot. This will require you to work with HTML, which will talk to PHP, which will liase with the database. This stack (frontend -> server -> database) actually never changes. You may change the programming language you use, but the basic stack will stay the same.
Congrats, you now know how to develop basic web applications.
However, most applications are no longer being made in PHP
After reaching this stage, you probably already know how to figure stuff out by yourself by reading documentation, and understand that you can fix most problems by running to our lord and saviour, stack overflow. Hence, Ill list a couple of technologies you should look at at this point.
React/Angular (presentation layer)
React is great for building responsive frontend applications. This is used in stuff like Google docs or Messenger. From my perspective, react is the one that is easier to understand and use, and can be leveraged later on to learn mobile app development with react native as well. Every element in react is it’s own component and you pass around properties from one components to its children (similar to Java’s OO, but this time, all methods of the parent are not passed to the child).
NoSQL (database layer)
NoSQL is a cool database which allows you to be really flexible with your data structure (basically you can store javascript objects directly, without the need to convert it to a table like format). You should look into this before you get to firebase.
Firebase (database layer)
This uses a structure similar to NoSQL, but it allows us to send real time updates to clients. If you’re making a messaging app or another live website, firebase is most likely the best way to start.
NodeJS (application layer)
NodeJS is cool for one main reason. It supports sockets, which are a way for you to send updates live to all your clients at once! It also runs on javascript (so no new language to learn)! You will have to install NodeJS when you use react, but theres no need to use the server part of it (npm serve) until this stage.
AWS/Azure/Heroku (Hosting)
Having built all these apps, I bet you’re looking for a way to host your applications on the internet! If its just a front end app (i.e. when you double click on index.html, it loads without the need to do anything else), you can use AWS S3 buckets to host static applications. These will be incredibly fast and scalable (automatically hosts it on a CDN). Find out more here.
If you need a backend, Heroku is the way to go. You should upload all your changes to github, then connect heroku to auto deploy from the github repository. Its amazing how cheap and easy heroku is, and it makes it consideribly faster than AWS/Azure to deploy a backend application.
Github and Git
Somewhere along the way, especially when you get to the backend stage. Theres an amazing website called First Timers Only, its incredibly helpful and introduces you to the basics of git!
Conclusion
I believe that the web will play a significant role in the future, especially when compared to android and iOS development. There are frameworks such as Flutter, Xarmin and React Native which allow developers to code in the language that they prefer (Dart, C# or JavaScript respectively) and run the code on all platforms. Javascript can also be used to make desktop applications using electron. Its been amazing to see so much progress in the web space.
Finally, I believe its incredibly important to at least know the basics of developing for the web, since it’s so oddly intertwined into our lives these days. If you’re starting out, build your own website from a template first. This an be a fanpage about something you are passionate about, or even just a copy of your resume. I wish all of you the best in your journey, and feel free to write back to me on twitter @deeplydiligent if you get stuck or have any questions.
