Newest Articles

html css beginners basics

HTML and CSS Basics, part 19: Building a layout with our micro CSS framework

Wednesday, September 25, 2019

In this tutorial, we'll continue learning HTML and CSS layout techniques by using the micro CSS framework we've built in the previous tutorial. We'll use our own micro CSS framework to build a simple HTML and CSS-powered website layout.

node.js javascript intermediate npm

Understanding Node, npm, JavaScript modules, and webpack

Wednesday, September 25, 2019

Why Node and npm? What’s up with Grunt, Gulp, and Webpack? Why choose one over the other? How to reliably share third-party libraries with your team? Why was it so hard - even impossible - to use modules in JavaScript in the past? In this article, we'll answer all these questions.

html css beginners basics

HTML and CSS Basics, part 18: Build your own micro CSS framework

Tuesday, September 24, 2019

This practical tutorial shows how to build your own CSS micro-framework. This tutorial is aimed at understanding the thinking behind popular CSS frameworks, and realizing that it's not some magical thing - it's just a collection of reusable HTML and CSS code snippets.

html css beginners basics

HTML and CSS Basics, part 17: Introduction to SCSS

Monday, September 23, 2019

In this introduction to SCSS and Sass, we'll see how to easily get started with these supersets of CSS and what are the benefits of using them. We also learn about how to use SCSS in our computer, and about using Node-sass.

html css beginners basics

HTML and CSS Basics, part 16: Frontend CSS frameworks

Saturday, September 21, 2019

In this tutorial, we go through an overview of a few very popular frontend frameworks: Bootstrap, Bulma, and Material Design Light.

html css beginners basics

HTML and CSS Basics, part 15: Column-based CSS layouts

Saturday, September 21, 2019

What are column-based CSS layouts and what led to them? What problems do they solve, and how to build a column-based CSS layout from scratch? That's what we'll learn in this tutorial. We'll finish the tutorial by learning how to make our column-based CSS layouts responsive.

html css beginners basics

HTML and CSS Basics, part 14: CSS resets and Emmet

Friday, September 20, 2019

Emmet helps us write HTML and CSS code faster. In this tutorial, we learn the basics of Emmet alongside CSS resets.

html css beginners basics

HTML and CSS Basics, part 13: Converting our first layout into a responsive one

Friday, September 20, 2019

In this tutorial we'll convert a static HTML layout into a responsive one. We'll introduce flexbox layout in CSS, and we'll make our flexbox-based layout responsive using media queries in CSS.

html css beginners basics

HTML and CSS Basics, part 12: Responsive web layouts with media queries

Thursday, September 19, 2019

With media queries, we can build layouts that respond to devices they're viewed on. In this tutorial, we'll see how media queries work, and how to get started using them in our CSS.

html css beginners basics

HTML and CSS Basics, part 11: Building the first layout

Thursday, September 19, 2019

In this tutorial, we'll build our first HTML and CSS layout. We'll learn about mocking up a web page, adding it structure using HTML, and styling it with CSS. We'll use the calc function in CSS, and style the header, sidebar, main area, and a footer.

Feel free to check out my work here: