All You Need to Know to Start Your Journey as a Web Developer

No tech background needed

Just a disclaimer, I'd like to think that the goal of this piece is to try to point an ignorant being interested in leveraging technology to build applications that make the world a better place into a direction where progress could be brought about. These are not instructions on how to make your first web application but are more of fundamental concepts that one needs to know to do so.

Programming

I still remember the definition of the word program from the slides of my Programming 101 class back in college, it's a "set of instructions" for a computer to run. Programming is basically telling a computer to do things so that we don't have to do it ourselves. We don't have to open a dictionary and flip through the pages until we get the meaning we're looking for, we can just type the word in google... or a dictionary app. We don't need to walk around the city to announce what we're having for lunch, we can tweet or make an ig story about it. It allows us to utilize technology in a very efficient way.

Languages

Programming languages are the medium of communication between humans and computers and there are a lot of variations out there that have their individual pros and cons. In web development, javascript, php, and ruby are among the popular ones.

Networks

Networks allow computers to talk to each other. It's the train infrastructure that transports our data from one computer station to another and that's why when you type "hello" on your chat text field and press "send", a system of interconnected devices involving routers and servers work together to relay that message allowing the other person to see your message in his or her device.

Version Control

Version Control allows us to modify our application repository in a process that's geared towards making it easy for developers to spot modifications made and revert to a previous stable version if needed. Developing applications ought to have a proper flow in adding modifications so that errors are less likely to occur and an incoming contributor can better understand the reason behind the existence of certain modules (an independent part of a codebase serving a specific function).

HTML, CSS, & Javascript

Almost every web developer starts at these 3 fundamental technologies.

HTML stands for hypertext markup language. It's very much worth noting that this is not a programming language. It's basically just a mirror of the contents you're putting in where contents include photos, videos, links (not just text; hence, the hypertext) and the structure is characterized by tags (hence, the markup) such as <p>, <img>, <a>, and <table> so that the browser knows the type of content you're putting in. You code in the html file and it's outputted as is when the browser opens it.

CSS stands for cascading style sheets. This is the part that assigns the design attributes of the html elements. The height, width, alignment, spacing, colors, etc. of the paragraphs, images, divisions, and the like are modified here.

Now, this is where things get interesting. This is the part where magic happens - along with some potential headaches.

Javascript is a programming language that's capable of manipulating the behavior of a web application on a deeper and much more convoluted manner. In HTML and CSS, all we're doing is adding elements with their basic properties. We could add a link with a red font color that leads us to a website. We could add an image that becomes black and white upon hover. If we want objects to appear or disappear upon a click of a button, change the background color from red to violet like a rainbow as a user scrolls down the page, or simply do some arithmetic operations - Javascript is our guy.

Front End vs Back End

Web development can be separated into 2 fields, the front end or the client side and the back end or the server side.

The front end is concerned with the visual interface of the application - the things the user sees, clicks, scrolls through, swipes, etc.

The back end is concerned with the processing of the data - samples of which are the encryption of the passwords being inputted, the filter restricting your posts and photos to be seen only by your friends, and the algorithm searching for potential tinder matches above 18 years of age and within 10 miles from where you are.

Reinventing the Wheel... NOT

In the world of programming, a library is a set of functions that can be utilized to build products faster because some features or functions are already commonly used by many applications. These libraries are sometimes called gems or packages. There's actually this whole technicality and heirarchy between the definition of the words module, library, and package but I'm not gonna dive into that for now. The point is - there are already things out there that are written so that you don't have to write them yourself. To paint you a picture, if you're building a house, you don't have to make the bricks yourself. You can get the bricks from someone who specializes in making bricks and assemble your house in the way you want to. You can opt to make the bricks yourself if you desire to do so - but if you want to ship your products faster, your time may be best utilized designated on building the features unique to your product or features that you can't really acquire due to budget constraints since not all of those bricks are free.

Community

In software development, more often than not, we're going to stumble across problems, issues, and errors and what do we do when we answers to our problems? - that's correct, we search for them. In these trying times, google and stackoverflow is your best friend. Stackoverflow is a website specific for developers asking other developers for help in their problems. The tricky part here is knowing how to phrase your problems correctly because telling your doctor that you're not feeling well doesn't really help or give any value in your pursuit of enlightenment and I believe learning how to phrase your questions is a skill that comes with experience. Personally, google has been the effective first order of operation for me. I mean, usually it just takes me to stackoverflow but I haven't really had the best experience in using stackoverflow's search engine.

Final Notes

Asking the right questions is a crucial step in heading the right direction. Adding the phrase "how to" before what you want to happen is generally an appropriate move.

Starting my web development journey, I finished two courses online @ codecademy for html & css. I haven't really finished a programming course online. I guess I just learn by doing and look up how to do something when I want to do it and not really learn all the nitty gritty things that a programming language can do given that I don't really know when I'm gonna use them and it would be inefficient for me to load it all in my head. It is however important to first know the basics of programming which are variables, loops, data structures, data types, and control structures to proceed.

I hope this helps in giving you a sense of direction. If you have any feedback, comments, or suggestions on what you'd want to read about next, feel free to reach out.

More From Me