• Replace all instances of a CSS class using vanilla JS (07 Mar 2020)
    How to use vanilla JavaScript to replace all instances of a CSS class with another CSS class on a web page? That's what we'll learn in this article.
  • MVC in Ruby on Rails (18 Dec 2019)
    This article explains the concept of MVC (Model - View - Controller), as it is implemented in Ruby on Rails.
  • Before you build your first app in Rails 6 (18 Dec 2019)
    In this article, we'll go into a number of concepts to learn before starting to code real apps in Ruby on Rails.
  • The Ultimate List of Productivity Boosters for Developers (05 Dec 2019)
    Productivity can be hard to improve, even if you're a talented web developer. Here's a list of tips and tricks that might help you boost your productivity as a web developer.
  • Multiplication table using nested for loops (03 Dec 2019)
    Nested for loops in JavaScript can help us with a number of coding tasks. In this article, we'll see how to use it to build a multiplication table and a domain-name generator.
  • Working with maps in JavaScript (02 Dec 2019)
    The map data structure is another data structure in JS that derives from the Object prototype. In this article, we're taking an in-depth look at maps in JS.
  • Working with arrays in JavaScript (02 Dec 2019)
    JS array prototype, array methods, array use cases, and a number of tips and tricks - we're going to cover all of that and more in this in-depth tutorial on arrays in JavaScript.
  • Working with sets in JavaScript (01 Dec 2019)
    This is an in-depth introduction to sets in JavaScript. A set is a special kind of a collection in JavaScript, holding only unique values.
  • Random and Useful Coding Tips (27 Nov 2019)
    In this tutorial, we list a number of tips and tricks that are related to coding, but can only fit into the category of 'miscellaneous'. Still, there are some useful tips there for sure.
  • Learning PHP, part 3 (19 Nov 2019)
    In this beginner-friendly tutorial on PHP, we'll cover functions, arrays, objects, classes, and running the REPL in php.
  • Learning PHP, part 2 (18 Nov 2019)
    Learn the basics of PHP syntax in this approachable tutorial for beginners. We cover the basics of working with Apache and php on Ubuntu.
  • Learning PHP, part 1 (17 Nov 2019)
    Start learning PHP from scratch, starting with this first article dealing with php installation and REPL.
  • Write a simple quiz app in JavaScript (10 Nov 2019)
    How to write a very simple quiz app in JavaScript? Find out in this introductory, beginner-friendly tutorial.
  • Write a simple todo app in JavaScript (10 Nov 2019)
    How to write a very simple todo app in vanilla JavaScript? Find out in this introductory, beginner-friendly tutorial.
  • Helpful tricks to learn JavaScript (08 Nov 2019)
    What are the ways to improve you JavaScript coding skills? How to get better faster? Are there any shortcuts to success? We try to find the answer to these questions and to give some practical tips and tricks in this article.
  • What are events in JavaScript (08 Nov 2019)
    JavaScript inline event handlers, event propagation, event bubbling and capturing, the Event object, and commonly used events in JS - we cover all of these topics in this tutorial.
  • Filter Google search results with JavaScript (08 Nov 2019)
    The ability to use JavaScript right in the browser, via the devtools console, opens up a world of possibilites, and a number of ways to practice using JavaScript. In this tutorial, we'll use JS to filter some search results in the Google search engine.
  • Useful JavaScript snippets (03 Nov 2019)
    This article lists a number of various snippets, tips, and tricks in JavaScript. This is an open-ended list of some cool ideas in JavaScript.
  • The Anatomy of a JavaScript function, part 5 (20 Oct 2019)
    There are well over a dozen ways to define a function in JavaScript. In this fifth article of the Anatomy of JavaScript functions article series, we go in depth, covering all the ways to define a function in JS.
  • The Anatomy of a JavaScript function, part 4 (20 Oct 2019)
    How to use the function arguments and how are they related to the ES6 speread operator? This is the topic in this fourth article in the article series titled: the Anatomy of JavaScript functions.
  • The Anatomy of a JavaScript function, part 3 (19 Oct 2019)
    What are the differences between ES5 and ES6 functions? We answer this question in this article, third in the series of articles on the Anatomy of JavaScript functions.
  • The Anatomy of a JavaScript function, part 2 (18 Oct 2019)
    How to generalize functions in JavaScript? Learn all about it in this second part of the Anatomy of JavaScript functions series of tutorials.
  • Building Bootstrap 4 layouts, part 12: Build a Shopify clone layout (11 Oct 2019)
    See how to clone a Shopify homepage layout in Bootstrap 4. We'll go step by step, from setting up the project and building the navbar, to setting the breakpoint for the toggle button, adding a hero section, showcase section, support, merchants, testimonials sections, and the footer area. We'll discuss flexbox in Bootstrap 4 and conclude with the completed live layout.
  • Start a minimal Express app with npm (10 Oct 2019)
    Here's a quick and easy introduction to Express and Node.js. Learn how to build a simple Express app and serve it locally using Node.js.
  • Building Bootstrap 4 layouts, part 11: Build an AirBnB clone layout (09 Oct 2019)
    See how to clone an AirBnB homepage layout in Bootstrap 4. We'll use the live AirBnB website to plan our layout, and then we'll build it, including forms, datepickers, cards, icons, testimonials, and star ratings. We'll also track our progress using Git so you can see each step of the development, and we'll commit our changes on GitHub so that it can easily be shared.
  • Should I first learn vanilla JavaScript or Angular? (08 Oct 2019)
    It's hard to choose what to learn in web development when there are so many options: should I learn vanilla JS or a framework like Angular? Find the answer in this article.
  • Building Bootstrap 4 layouts, part 10: Build a Bootstrap 4 layout and track it with Git (07 Oct 2019)
    See how to build a Bootstrap 4 layout step-by-step with the help of GitHub so that you can track your progress. We'll use the Brackets editor and the Github Desktop app. We'll build a custom layout using the Carousel example layout as our starting point. We'll also add a scrollspy to our navbar so that it updates as visitors scroll down our page.
  • Building Bootstrap 4 layouts, part 9: Build another Bootstrap layout in Angular (06 Oct 2019)
    This tutorial shows how to cherry-pick Bootstrap 4 components to quickly build a Boostrap 4 layout with Angular 8. We'll also use GitHub to keep track of updates to our project, and Stackblitz to develop our theme in an online IDE, so that we can share it easier.
  • Building Bootstrap 4 layouts, part 8: Modularize your Bootstrap layouts (05 Oct 2019)
    In part 8 of Building Bootstrap layouts tutorial series, we'll learn how to modularize our Bootstrap layouts with the help of Angular. This post will also be a gentle introduction into the very basics of Angular 8. We'll use Stackblitz to help us build a minimal Angular app, and we'll add our Bootstrap 4 layout on top of it.
  • Building Bootstrap 4 layouts, part 7: Building a typography-focused layout (04 Oct 2019)
    In this tutorial we'll build a complete Boostrap 4 layout based on the official Bootstrap 4 starter layout. We'll use some free fonts from the Google fonts website to build a typography-focused website layout. We'll also use the Brackets editor so that we can see our changes updated live. We'll copy a custom navbar from a premium Bootstrap theme and learn a bunch of stuff in the process.
  • Building Bootstrap 4 layouts, part 6: Working with SCSS in Bootstrap 4 (03 Oct 2019)
    In this tutorial we'll upgrade the Checkout from example from the official getbootstrap website. We'll work with SCSS using th Koala app and Bootstrap 4.3 SCSS files. We'll see how to change default Bootstrap SCSS variables to get a custom layout.
  • Building Bootstrap 4 layouts, part 5: Improving Bootstrap's official examples (01 Oct 2019)
    Let's upgrade the official Pricing example layout from the official getbootstrap website. We'll copy custom CSS from another Bootstrap layout so that we make a custom, hybrid layout. We'll learn how to copy a Bootstrap 4's theme CSS file, and how to trim the unused CSS using Chrome devtools.
  • Building Bootstrap 4 layouts, part 4: Improving Bootstrap's official examples (30 Sep 2019)
    Let's upgrade the official Album example layout from the official getbootstrap website. We'll make it our own by adding transparency to the background color, adding some images, and learning about some Chrome developer tools functionality.
  • Building Bootstrap 4 layouts, part 3: Bootstrap components (30 Sep 2019)
    What are components in Boostrap 4? We can divide them into primary and secondary components. We'll use several of these primary components to build a simple and nice-looking layout, with a navbar, a carousel, a heading and some cards. Build a Bootstrap 4 layout quickly in this fun tutorial!
  • Building Bootstrap 4 layouts, part 2: Rows and responsive columns (29 Sep 2019)
    Learn about Bootstrap 4's column grid and build a simple responsive layout in this tutorial. Additionally, understand how the row class works in combination with column classes and how they all fit in container classes in Bootstrap 4.
  • Building Bootstrap 4 layouts, part 1: Containers and contextual colors (28 Sep 2019)
    Learn about Bootstrap containers and about the difference between regular containers and fluid containers. Additionally, we'll cover Bootstrap 4's contextual color classes: primary, secondary, success, danger, warning, info, light and dark. Learn how these are used for backgrounds and text color.
  • HTML and CSS Basics, part 24: CSS tips and tricks for beginners (27 Sep 2019)
    This article shows 10 practical tips and tricks in CSS for beginners and junior frontend developers. We cover these topics: centering a div, why not override framework CSS directly, how to make narrow containers in Bootstrap, which HTML element to use to style navigation, what are over-qualified CSS selectors, and more!
  • HTML and CSS Basics, part 23: CSS grid (26 Sep 2019)
    What is the difference between CSS flexbox and CSS grid? How to use the former and the latter? Learn all of this and more in our in-depth introductory article on using CSS grid.
  • HTML and CSS Basics, part 22: CSS variables (25 Sep 2019)
    This tutorial is a genle introduction to CSS variables. We'll start with a CSS example layout that uses no variables, and we'll convert it to a layout that uses CSS variables. During this process, we'll learn why CSS variables are so useful.
  • HTML and CSS Basics, part 21: CSS animations and transitions (25 Sep 2019)
    Learn the basics of using CSS transitions and animations, what makes them similar, and what makes them different. Additionally, learn the basic rules of using CSS transitions and animations in this tutorial.
  • HTML and CSS Basics, part 20: Building a layout with Bootstrap (25 Sep 2019)
    How to build a simple layout with Bootstrap 4? We'll learn all about it in this tutorial, the twentieth in the HTML and CSS basics article series.
  • HTML and CSS Basics, part 19: Building a layout with our micro CSS framework (25 Sep 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.
  • HTML and CSS Basics, part 18: Build your own micro CSS framework (24 Sep 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 and CSS Basics, part 17: Introduction to SCSS (23 Sep 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 and CSS Basics, part 16: Frontend CSS frameworks (21 Sep 2019)
    In this tutorial, we go through an overview of a few very popular frontend frameworks: Bootstrap, Bulma, and Material Design Light.
  • HTML and CSS Basics, part 15: Column-based CSS layouts (21 Sep 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 and CSS Basics, part 14: CSS resets and Emmet (20 Sep 2019)
    Emmet helps us write HTML and CSS code faster. In this tutorial, we learn the basics of Emmet alongside CSS resets.
  • HTML and CSS Basics, part 13: Converting our first layout into a responsive one (20 Sep 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 and CSS Basics, part 12: Responsive web layouts with media queries (19 Sep 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 and CSS Basics, part 11: Building the first layout (19 Sep 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.
  • HTML and CSS Basics, part 9: Images and floats in CSS (17 Sep 2019)
    In this tutorial we learn all about images and floats in CSS. We see how floats were used in the past to build layouts, and we learn that it's not such a good idea today, because we have better layout techniques at our disposal. Additionally, we learn that images are inline elements, and we learn how to clear floats.
  • HTML and CSS Basics, part 10: CSS selectors and CSS targeting revisited (17 Sep 2019)
    Learn about the most commonly used CSS selectors, and the role of CSS specificity in how the browser determines what CSS selectors to apply to a part of a web site.
  • All the CSS selectors (17 Sep 2019)
    All the CSS selectors with examples are listed in this one single article. Learn about more than 35 CSS selectors in this ultimate list of CSS selectors, sure to cover any CSS targeting use case.
  • HTML and CSS Basics, part 8: Relative, absolute, and fixed positioning (16 Sep 2019)
    In this tutorial we'll examine the differences between relative, absolute, and fixed positioning, and what happens when we position a parent element relatively, and a child element absolutely in our HTML layouts.
  • HTML and CSS Basics, part 7: CSS positioning (15 Sep 2019)
    What is CSS positioning about? How does relative positioning work with top, right, bottom, and left values specified? Find the answers to these questions in the seventh article in our HTML and CSS basics article series.
  • HTML and CSS Basics, part 6: the box model (14 Sep 2019)
    What is the box model in CSS and how to preview it in our browser's developer tools? This tutorial answers these questions. Additionally, we look at how to controll the box model using CSS, and how to specify individual paddings and margins to our HTML elements.
  • HTML and CSS Basics, part 5: block vs inline elements (13 Sep 2019)
    In the fifth article in our series titled HTML and CSS basics, we discuss the interplay between display property and block-level and inline HTML elements.
  • HTML and CSS Basics, part 4: controlling document flow via display property (13 Sep 2019)
    We can control the document flow of HTML documents using the display property in CSS. This allows us to swtich block-level elements to inline elements, and vice-versa. In this tutorial, we'll see exactly how this is done.
  • HTML and CSS Basics, part 3: CSS element selectors VS class selectors (12 Sep 2019)
    How to style block-level HTML elements? How to style them using CSS classes? We discuss these questions in the third article in our HTML and CSS basics article series. We conclude this tutorial with the benefits of using CSS classes over CSS element selectors.
  • HTML and CSS Basics, part 2: normal document flow, block elements, inline elements (10 Sep 2019)
    In the second article of our HTML and CSS basics, we'll learn about normal document flow of web pages, as well as the differences between block HTML elements and inline HTML elements.
  • HTML and CSS Basics, part 1: whitespace, HTML elements, and CSS selectors (10 Sep 2019)
    We'll begin learning HTML and CSS basics by learning about whitespace, HTML elements, and CSS selectors. We'll learn how HTML and CSS work together to build web pages.
  • Learning JavaScript basics by coding tiny apps, part 2 (09 Sep 2019)
    When you're learning to code, it's always a good idea to try to build apps on your own. These apps don't have to be big; actually, as a beginner, it's better if apps are tiny. In this tutorial, we'll see how to learn JS by building a simple game of choice.
  • Working with data in Angular 8, part 3 (09 Sep 2019)
    In this intro tutorial on working with data in Angular, we'll learn how to loop over some data and additionally, use ng-container in our code.
  • Learning JavaScript basics by coding tiny apps (08 Sep 2019)
    When you're learning to code, it's always a good idea to try to build apps on your own. These apps don't have to be big; actually, as a beginner, it's better if apps are tiny. In this tutorial, we'll see how to learn JS by building a simple game of choice.
  • Working with data in Angular 8, part 2 (06 Sep 2019)
    In this beginner-friendly article we continue our exploration of how to work with data in Angular.
  • Working with data in Angular 8, part 1 (06 Sep 2019)
    How to work with data in Angular? That's what this beginner-friendly tutorial is about. Using a simple, practical example, we get started understanding working with data in Angular.
  • Add a custom pipe to Angular 8 (22 Aug 2019)
    In this hands-on tutorial, learn how to add a custom pipe to your Angular app. Live code example available on Stackblitz (link inside the tutorial).
  • Working with BootstrapVue accordions (04 Jun 2019)
    This article shows how to work with BootstrapVue accordions. There are several options that we can use here, and we'll go over most of them in this tutorial.
  • Getting started with Github for beginners (04 May 2019)
    This article is a gentle introduction to GitHub for complete beginners. Learn the basics of GitHub the practical way, by following this tutorial.
  • Building Apps With Angular (29 Apr 2019)
    Angular app ideas can be found in this list of Angular apps that one can build while learning Angular. Some of the apps in this list are actual tutorials, others are just app ideas.
  • How to Write Better PHP: An Ultimate List of Tips for PHP Beginners (06 Apr 2019)
    PHP beginners will find some great tips and tricks regarding PHP here. This article is ever expanding, with new additions added from time to time.
  • 10 Reasons to Choose JavaScript As Your First Coding Language (18 Mar 2019)
    If you're planning to start learning a coding language, you can't go wrong with JavaScript. In this article we bring you 10 reasons why choose JavaScript as your first programming language.
  • An In-Depth Introduction To Start Coding in PHP Today (31 Jan 2019)
    In-depth PHP basics for newbie web developers, how to get started quickly, and some practical examples and exercises - we cover all of this and more in this article.
  • The anatomy of a JavaScript function, part 1 (03 Dec 2018)
    This tutorial compares JS functions to simple machines. We go step by step, building a JS function from scratch. We follow all the technical jargon with in-depth explanations and diagrams. By the end of the article, you should have a solid understanding of how JS functions work. Additionally, this is only the first in a series of several articles about the inner workings of JS functions.