Breaking It Down

Most web or mobile developers use a tech stack in their day to day programming as it consists of tools and technologies used to create an application. It is the building block used to string up the different components of software. It is essential to choose a good stack because it can influence decision-making in a software development process. Different technologies are used by developers and software engineers when working on a project, for example:

Front-end developers may use a combination of

• HTML language for document structure;
• CSS for styling the user interface and,
• JavaScript to add interactivity to the web application.

Back-end Developers may use a combination of

• Python programming language;
• Apache webserver and,
• Oracle database.

Get the idea?

Personally, my tech stack is HTML5, CSS3, and JavaScript. It is what runs on a client's web browser to enable them to view a web page. I will highlight and briefly explain these technologies and why I use them.

HTML (HyperText Markup Language)

HTML is a markup language that acts as the skeletal framework of a web page. It structures the document such that it defines the ordering and formatting of text, images, and videos, displayed in a web browser. In writing HTML, there are code structures such as element tags and attributes used to 'mark up' a page. This means in every element tag, the tag determines how a text is displayed.

Below, is a button, paragraph, and bold tag on separate lines.

HTML is not difficult to use, as soon as I understood how the semantics work, it became as easy as typing a document in Microsoft Word. There are several element tags, but a quick google search helps with useful results. W3Schools is also a helpful resource I use to retrieve the list of tags I need. Nonetheless, with consistency, I have been able to remember a couple immediately I need to use them.

I currently use HTML5 which is an upgrade from HTML4. The HTML5 update came with more tags such as <video> for video elements, <progress> for a progress bar, <footer> for the footer section of a web page and several other tags for better semantics.

CSS (Cascading Style Sheets)

Just as HTML acts as the skeleton of a website, CSS determines how the skin of the website should look. It is responsible for the styling that makes the web document look presentable. CSS defines the layout, positioning of elements, font style, colours, animations, and many other properties, to make a website visually pleasing.

I added some styling to the paragraph, bold, and button tags I wrote above.

CSS helps enhance my creativity and gives me flexibility when creating complicated layouts or design patterns of a webpage. It took a lot of practice to understand how to replicate several user interface designs, but once I found I could hack it, CSS became my favourite tool. But beware, debugging CSS can be mind-boggling. 😅

I use CSS3, an extension of CSS2 but with new styling features to enhance web appearance and capabilities.

JavaScript

Whenever you hear JavaScript, think of interactivity. Using only HTML and CSS creates static sites that do nothing but display what has been hard-coded by the web developer. For instance, a website handling multiple users needs to be dynamic enough to serve its purpose, while triggering responses tailored to a users' action or input. Without interactivity, such websites are not functional enough. Some examples of dynamic content powered by JavaScript include ;

• Interactive Maps
• Animated Graphics
• Scientific Calculator etc.

To see JavaScript in action on the client-side, I have added it to the HTML and CSS layers written above.

I am still learning JavaScript, there will always a better way to approach an algorithm that takes care of some problem.

I use Javascript ES6. It is an improvement on ES5 syntax to make code cleaner and more readable. With ES6, I have discovered that adding a few lines of JavaScript can make quite the difference.

JavaScript is also used for server-side development.

Conclusion

I recommend the usage of a good tech stack, it will serve as a guide to laying a good foundation for a quality website or application. A careful selection of frameworks, programming languages, and development tools is encouraged to ensure the scalability, functionality, and viability of a web application.