Here are all our TUTORIALS:
Supercharge Your Mac and Ubuntu Terminals: Navigating Between Words
Saturday, June 3, 2023
Looking to supercharge your productivity in the Mac terminal? Learn how to add custom key bindings to your zsh terminal and unlock a whole new level of command-line efficiency.
How to add an icon to an HTML element using the ::before pseudo class in CSS
Monday, March 27, 2023
How to add an icon using the CSS ::before pseudo class? In this article, we go in-depth in answering this using several different approaches.
Understanding Python's built-in data types as a JavaScript developer
Sunday, March 26, 2023
Learn about Python's built-in data types, including numeric types, sequences, mappings, and sets, and how they compare to their JavaScript counterparts. This article explains the similarities and differences between Python's int, float, complex, str, list, tuple, dict, set, and frozenset data types and the Number, String, Array, Object, and Set types in JavaScript.
Your first Python app
Saturday, March 25, 2023
Learn how to create your first Python app with user input and variables. Follow these simple steps to prompt the user for their name, store it in a variable, and display a personalized greeting message. Python is an easy-to-learn programming language that is ideal for beginners. Get started with your first Python app today!
Run Jekyll server on a different port
Friday, March 24, 2023
Jekyll is GitHub's serverless blogging technology. Here I'll show you how to serve it on port 4001, or any other port that's different from the default port 4000.
Code a Weather App in React, part 1
Thursday, March 23, 2023
Learn how to build a weather app in React using hooks in this step-by-step tutorial. You'll use the OpenWeatherMap API to fetch weather data and display it in a component. You'll also add dynamic city input using useState hook and learn about useEffect and CSS styling. Code samples are provided for each step of the tutorial.
Code a Tic-Tac-Toe game in React, part 2
Wednesday, March 22, 2023
How to code a tic-tac-toe game in React, using hooks? Here's another way to do it, in this tutorial.
Code a Tic-Tac-Toe game in React, part 1
Tuesday, March 21, 2023
How to code a tic-tac-toe game in React, using hooks? Here's one way to do it, in this tutorial.
React Example Apps
Monday, March 20, 2023
A list of free React app examples found online with a short description of what each example is about.
Revisiting Jekyll on Ubuntu 20.04
Friday, December 16, 2022
A discussion of working with Jekyll (GitHub's serverless blogging technology) after a long pause, and running it on a brand new Ubuntu 20.04 installation.
react javascript react-from-scratch
Rebuild a Todo app using create-react-app
Tuesday, January 25, 2022
Based on the React Todo app we've already built on Codepen, we're now rebuilding it locally, so that we can further improve our understanding of React.
react javascript react-from-scratch
Build a todo app in React, using hooks and functional components
Tuesday, January 25, 2022
react javascript react-from-scratch
Class-based components, functional components, and React hooks
Tuesday, January 25, 2022
What's the difference between class-based and functional components, and where do React hooks fit into the picture. Find out all of that in this tutorial.
react javascript react-from-scratch
Beginner-level tips and tricks in React
Tuesday, January 25, 2022
Beginner-level React tips and tricks: code organization, passing objects as props, default props, using ternaries in our components, using fragments, handling events, checking if props are truthy, and more.
react javascript react-from-scratch
Looping over data in React
Tuesday, January 25, 2022
We'll add a new JavaScript file with an array of objects, and then we'll loop over this array of objects using the Array.prototype.map method in our React code.
react javascript react-from-scratch
Moving from ES5 to ES6 functions in React
Tuesday, January 25, 2022
Learn to update React apps from ES5 to ES6 functional components; additionally, learn how Babel works with ES6 functions in React.
react javascript react-from-scratch
Adding icons to a React layout
Tuesday, January 25, 2022
Learn to add icons to React apps in this tutorial. We're using a simple React-powered layout built in Bootstrap as the foundation, and we're adding icons to this pre-built layout.
react javascript react-from-scratch
Build a Bootstrap layout in React
Monday, January 24, 2022
React is all about components. In this tutorial, we'll learn about how these components are composable and we'll build a simple Bootstrap layout doing it.
react javascript react-from-scratch
React props basics, practical examples
Saturday, January 22, 2022
react javascript react-from-scratch
Build a create-react-app starter app
Friday, January 21, 2022
We'll build a React app using create-react-app, then learn how to tweak it. Next, we'll compare a local and a cdn-powered version of the same simple React app to further understand the differences between the two approaches.
react javascript react-from-scratch
Serving React from a CDN and running it without a build step
Thursday, January 20, 2022
We can use React without a build step. In this tutorial, we'll learn how to include React from a CDN and use it in our projects right away.
react javascript react-from-scratch
Building the simplest possible React app
Thursday, January 20, 2022
A perfect tutorial for a beginner in React: learn how to get started with it and all the tools you need to get started with it. Additionally, we'll build a very simple app in React.
react javascript react-from-scratch
React from Scratch
Tuesday, January 18, 2022
In the React from scratch article series, we'll learn all there is to know about the React framework, from the very beginning.
Thinking About a Career in IT? Here's What You Need to Know
Wednesday, December 22, 2021
Currently, 12+ million people are working in technology-related jobs. For many people, the idea of joining them is a dream, but it’s also a bit intimidating. Luckily, starting a career in IT isn’t as complicated as it may seem.
Simple productivity tips for developers
Friday, September 24, 2021
In this post I'll discuss ways to increase our productivity as web developers.
My Summary of 'Management and Control of Technical Labor'
Wednesday, September 22, 2021
Expert workers by the definition can be 'difficult' to manage because even if their managers used to be on the cutting edge, the management duties 'blunt their sword' and their skills become rusty. This summary discusses the HBR publication on potential ways to mitigate the issue.
How to become a great developer
Monday, August 23, 2021
How do you become a well-respected, recognized professional in your area of expertise? What does that mean? Why is it important? Here are some of my thoughts on the topic.
Gestalt theory in web design
Wednesday, August 18, 2021
Gestalt theory was very influential in understanding design and the way we process the world around us. That's why it's important to know the basic Gestalt principles as we can then implement them in our web designs.
10 Reasons to Write Tutorials as a Web Developer
Saturday, July 24, 2021
It's important to write tutorials, if you're a web developer. Why? So many reasons - but basically, it will help your career tremendously.
Build a blog post image maker app in vanilla JS
Thursday, June 17, 2021
Blog post image generator app tutorial. Learn to build blog post images right in your browser. This post shows you how to do it, step by step.
Let's Learn HTML Drag and Drop API
Wednesday, June 16, 2021
In this post we'll explore the Drag and Drop API in modern browsers until we get comfortable using this functionality.
9 Ideas to Learn Web Develpment Faster and Easier
Tuesday, June 15, 2021
In this article, I'm sharing insights I've learned through the years of working in all kinds of IT companies, through the view-point of a self-taught developer. I explain some ideas, tips, and tricks I got along the way - working in the good, the bad, and the ugly work environments in IT.
A Complete List of Subclasses for HTMLElement interface in JS DOM
Thursday, April 15, 2021
HTML Element interface has a number of subclasses available in modern browsers. Some of them have been deprecated, and others are safe to use. Here's a list that shows all of those subclasses that are available in Chrome, plus some deprecated subclasses that are no longer exposed.
VS Code tips and tricks for beginners
Wednesday, February 24, 2021
VS Code gotchas, tips, tricks, and experiences from working with the framwork can be found in this article.
Useful Docker tips and tricks
Sunday, February 21, 2021
In this article, I'm listing the Docker-related tips and tricks I've learned while working with Docker on Ubuntu.
Vue.js tips and tricks
Thursday, February 11, 2021
Looking for Vue.js tips and tricks? This ever-growing list of tips and tricks in using Vue.js comes from the day-to-day work as a Vue.js developer. Like some other blog posts on this site, it doesn't have too much content now, but I'll keep adding stuff as I stumble upon it in my day-to-day work.
Build the smallest possible Vue app
Wednesday, February 10, 2021
In this gentle introduction to Vue.js we'll learn about the basic ins and outs of this modern JS framework.
javascript exercises beginners
Hoisting differences related to keywords var, let and const in JS
Wednesday, January 27, 2021
We all know that the var keyword should not be used in our code, and that we should mostly use let and const. We've probably already read articles about the reasons for this and how to use them properly. But what are the differences between var, let, and const, in relation to hoisting? Let's find out.
javascript exercises beginners
Find the key code for a keydown or keyup event in JavaScript
Wednesday, January 27, 2021
Key up and key down events in JS return a bunch of information in the Event object. This information includes the keycode data. In this tutorial we discuss how to get that info with JS.
javascript exercises beginners
Using cookies in JavaScript
Tuesday, January 26, 2021
Cookies are one of the oldest ways of saving text-based data on the web. The data that gets saved is not meant to be large. It's use case is to 'remember' some things about the user, even after they have closed the web page or the browser. In this article, we'll learn about working with cookies in JS.
javascript exercises beginners
Convert an object to array in JS
Friday, January 22, 2021
Converting an object to an array is pretty easy in JavaScript. All we have to do is use Object.keys, or an even easier method to use, Object.entries.
javascript exercises beginners
Get an object's length in JavaScript
Thursday, January 21, 2021
To get the length of an object in JS, we use Object.keys() to get an array of our object's own properties' keys. Then we can easily return the length value.
javascript exercises beginners
Build a multi-dimensional array in JavaScript
Monday, January 18, 2021
How to build matrices in JS? Also known as multi-dimensional arrays, these are just arrays of arrays in JS. An easy way to build multi-dimensional arrays is to output them using nested loops, as we'll show in this tutorial.
javascript exercises beginners
Convert kebab case to camel case in JavaScript
Monday, January 18, 2021
It's the combination of String.prototype.match(), RegExp, and String.prototype.replace() that gives us the solution to coverting a kebab case string to camel case string in JS.
javascript exercises beginners
Capitalize the first letter of a string in JavaScript
Monday, January 18, 2021
The trick is to separate the string into the first letter and the rest of the string using charAt() and slice(), then run the toUpperCase() method on the first substring, and concatenate the rest of the original string back to the uppercased first letter.
javascript exercises beginners
Insert CSS styles with JavaScript
Sunday, January 17, 2021
Appending a style tag to the head tag of an HTML document requires some simple DOM manipulation. In this tutorial, we'll discuss how to do this, and all the other ways of adding styles using JS.
javascript exercises beginners
Compute the factorial of a number with JavaScript
Sunday, January 17, 2021
Calculating a factorial is very easy, but many JS implementations online make this problem unnecessarily complex. In this tutorial, we'll see the basics of how to calculate a factorial in JavaScript. We'll also go through the explanation of building a factorial calculating function in JS step-by-step.
javascript exercises beginners
Calculate the Fibonacci sequence in JS
Saturday, January 16, 2021
Fibonacci sequence in JS should not be hard to build. In this article, we show step-by-step, how to build in a few simple steps, a rudimentary fibonacci sequence. Once we know the basic mehanism that lies behind the logic of fibonacci sequence code, we can then build more complex code based on this foundation.
javascript exercises beginners
Count the number of times a substring appears in a string in JavaScript
Friday, January 15, 2021
Have you ever tried to see how many times a letter or a word appears in a string? Or how many times a value is repeated in an array? This tutorial shows you how to figure that out in JS.
javascript exercises beginners
Convert an array of numbers to an array of ordinal numbers in JS
Thursday, January 14, 2021
To format an array of numbers as ordinal numbers, we need to properly add the suffixes -st, -nd, -rd, and -th to correct numbers. This includes numbers 11, 12, and 13, which are a bit of an edge case. In this article, we discuss how this works.
javascript exercises beginners
Format a number as currency in JS
Wednesday, January 13, 2021
Formatting a number as currency in JS is easy. We can use Intl.NumberFormat(), and style it as currency, or we can use the toLocaleString method, and again provide the style parameter to the options object.
javascript exercises beginners
Format a number with comma as a thousands separator in JS
Tuesday, January 12, 2021
In JS, we can add a comma as thousands separator using the toLocaleString() method, or using Intl.NumberFormat().format, or using a RegExp. In this tutorial, we'll cover the first two listed means of doing this.
javascript exercises beginners
Generate a random sub-array from a larger array
Monday, January 11, 2021
To get a random, three-member sub-array from an array of items, we need to use the splice, Math.random, and array flat methods, along with a simple for loop. It's a nice and easy solution, and in this tutorial, we'll go through each step of how to do this.
javascript exercises beginners
Add random CSS classes to a paragraph in JavaScript
Sunday, January 10, 2021
We have a web page with a script tag. That script tag holds an array of various Bootstrap 4 CSS classes, and our JavaScript picks a random member from this array and assigns it as a CSS class to a paragraph in our web page's body tag.
javascript exercises beginners
Generate a random password with JavaScript
Saturday, January 9, 2021
We can easily whip up our own password generator in vanilla JS. This tutorial shows you how to do it, step by step, with each step explained in detail.
javascript exercises beginners
Randomize the order of members in a JavaScript array
Friday, January 8, 2021
Randomly reordering members of a JavaScript array might seem an easy task, but it can also be difficult to junior developers. See a step-by-step solution with a detailed explanation of how to shuffle an array in JS.
javascript exercises beginners
Get a number randomly from a range of numbers in JS
Thursday, January 7, 2021
Math.random() gives us a range between 0 (inclusive) and 1 (exclusive). But how do we use this method to get a random number from a range of numbers, say, a random number between 30 and 60? Read more to find out...
javascript exercises beginners
Randomly return a true or false from a JavaScript function
Thursday, January 7, 2021
Using the conditional (ternary) operator, we are able to easily return, at random, either a boolean true or false in JS. Additionally, by setting up our condition differently, we can affect the frequency of one result over the other. In this article, we explain how this works.
javascript exercises beginners
Pick a random member from a JavaScript array
Wednesday, January 6, 2021
Multiply the length of array with the call to Math object's random method, then floor the result. We'll explain how that's done in this article.
javascript exercises beginners
Emulate a six-sided dice
Tuesday, January 5, 2021
Use Math.random() static method to emulate a pair of dice in JavaScript, and keep in mind these simple tips.
What to do when met with a tough coding problem
Saturday, December 26, 2020
Got stuck on a tough coding task? Even veteran programmers sometimes experience this. Don't lose your cool: in this article we cover several things to do when you're stuck on a coding problem.
Magento 2 tips and tricks for beginners
Sunday, December 20, 2020
In this post, we list lessons and gotchas picked up while learning Magento 2.
Node types in the DOM
Saturday, December 12, 2020
There are 12 node types in the DOM. It's useful to know at least the few of those that are most commonly used.
Objects vs non-objects in JavaScript
Saturday, December 12, 2020
This article discusses the difference between objects and non-objects in the JavaScript language.
Working with onload events in vanilla JS
Saturday, November 28, 2020
Understanding how onload event works in the DOM with vanilla JS is a very important piece of knowledge for a web developer. In this article we'll cover this topic in depth.
Rebuild a Bootstrap 4 example with BootstrapVue
Thursday, October 8, 2020
Learn how to rebuild a Bootstrap 4 example from the official docs, using the BootstrapVue framework. This is a practical exercise to get more familiar with both Vue and BootstrapVue.
How to use BootstrapVue aspect component
Wednesday, October 7, 2020
Learn how to setup and use BootstrapVue alerts in a brand new Vue app, from scratch.
How to use BootstrapVue alert component
Wednesday, October 7, 2020
Learn how to setup and use BootstrapVue alerts in a brand new Vue app, from scratch.
How to use BootstrapVue modals
Monday, October 5, 2020
Learn how to setup and use BootstrapVue modals in a brand new Vue app, from scratch.
How to use BootstrapVue modals
Monday, October 5, 2020
Learn how to setup and use BootstrapVue modals in a brand new Vue app, from scratch.
Prepping a brand new Vue app for BootstrapVue practice
Saturday, October 3, 2020
This is a step-by-step guide to setting up a brand new Vue app to work with the BootstrapVue library.
Build your first Vue 2 app today
Wednesday, September 30, 2020
Learn how to code a simple app in Vue.js in this easy, beginner-friendly tutorial.
The proper way to install Nodejs on Ubuntu 18.04
Saturday, September 26, 2020
How to install Nodejs on a brand new Ubuntu 18.04 installation? That's what this article is about.
CSS position sticky
Friday, September 25, 2020
Position:sticky in CSS; what is it, how it works, and a few practical examples can be found in this CSS tutorial.
Replace all instances of a CSS class using vanilla JS
Saturday, March 7, 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.
Useful Git tips and tricks
Sunday, March 1, 2020
After years of unintentionally learning Git through everyday coding at a job, I've picked up a few Git tricks and useful Git snippets, that I'm sharing in this post.
Install Jekyll on Ubuntu 18.04
Tuesday, December 31, 2019
Learn how to install Jekyll (GitHub's serverless blog platform) from scratch on a brand new Ubuntu 18.04 installation.
MVC in Ruby on Rails
Wednesday, December 18, 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
Wednesday, December 18, 2019
In this article, we'll go into a number of concepts to learn before starting to code real apps in Ruby on Rails.
Build a Simple Movie Reviews Website in Rails 6, part 3
Monday, December 16, 2019
This is part 3 of our in-depth tutorial on building a movie reviews website in the Rails framework.
Build a Simple Movie Reviews Website in Rails 6, part 2
Sunday, December 15, 2019
This is part 2 of our in-depth tutorial on building a movie reviews website in the Rails framework.
Build a Simple Movie Reviews Website in Rails 6, part 1
Saturday, December 14, 2019
Are you ready to build your first project in Rails? You've read about Ruby and it's most popular Ruby on Rails framework; you've read about MVC and learned some basic SQL; now's the time to build that first project!
The Ultimate List of Productivity Boosters for Developers
Thursday, December 5, 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
Tuesday, December 3, 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
Monday, December 2, 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
Monday, December 2, 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
Sunday, December 1, 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.
Life Advice from Jordan Peterson
Wednesday, November 27, 2019
There is more to life than coding. In this article, we learn some insights from Jordan Peterson.
Life Advice from Matthew McConaughey
Wednesday, November 27, 2019
Besides coding, us developers need to 'debug' other problems in life. Here are some great life lessons from the charismatic Matthew McConaughey.
Practicing JavaScript by playing with SVGs on YouTube web app
Wednesday, November 27, 2019
DOM manipulation, working with SVGs and JavaScript events - we cover all of that in this beginner-friendly tutorial.
Dynamically change styles using JavaScript
Sunday, November 24, 2019
In this tutorial, we'll work with events to change the background color of an element dynamically, using JavaScript.
Learning PHP, part 2
Monday, November 18, 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
Sunday, November 17, 2019
Start learning PHP from scratch, starting with this first article dealing with php installation and REPL.
Write a simple quiz app in JavaScript
Sunday, November 10, 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
Sunday, November 10, 2019
How to write a very simple todo app in vanilla JavaScript? Find out in this introductory, beginner-friendly tutorial.
A Better Way to Learn JavaScript
Sunday, November 10, 2019
This article gives some background information about my fifth book, A Better Way to Learn JavaScript; the book is currently in version 1.0, and is available for sale at Leanpub.
Helpful tricks to learn JavaScript
Friday, November 8, 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
Friday, November 8, 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
Friday, November 8, 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.
Quickstart Elm 0.19, part 18
Thursday, November 7, 2019
In this tutorial, we'll learn about ports in Elm. Ports allow Elm apps to communicate with JavaScript. With their help, we'll model state in localStorage.
Troubleshoot ng command on Windows 10
Thursday, November 7, 2019
What to do when npm -g install @angular/cli does not work? Here's a simple solution for this problem.
Quickstart Elm 0.19, part 17
Wednesday, November 6, 2019
In this tutorial, we'll discuss side effect in Elm. We'll look at Elm from a more theoretical angle and discuss the benefits of using a functional language on the front end. One of those benefits is error-driven development. We'll also discuss randomness and Commands, Subscriptions, and Effects in Elm, and apply them in practice in our todo app. Additionally, we'll underline the importance of p...
Useful JavaScript snippets
Sunday, November 3, 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.
Angular 8 tips and tricks
Saturday, November 2, 2019
In this ever-expanding article, we list a number of Angular tips, tricks, and gotchas, obtained through day-to-day work with the Angular framework.
Quickstart Elm 0.19, part 16
Thursday, October 31, 2019
How to make todo items editable in a simple todo app in Elm? That's what we'll learn in this tutorial. Specifically, we'll learn how an HTML input sends a message when an onInput event fires. This is an in-depth, step-by-step article. We'll explain all the underlying concepts here.
Quickstart Elm 0.19, part 15
Thursday, October 31, 2019
This tutorial covers using Result and Maybe in Elm 0.19. We'll destructure a Maybe and work with Result and Maybe defaults. We'll also learn how to import packages into our Elm apps.
Quickstart Elm 0.19, part 14
Thursday, October 31, 2019
In this tutorial on the Elm language, we'll learn how to capture the ENTER keypress, and we'll learn a neat trick on how to write correct functions signatures, and why this matters.
Quickstart Elm 0.19, part 13
Wednesday, October 30, 2019
In this tutorial on the Elm language, let's learn to use the let expression. We'll learn how to add a number in front of each todo item we add via a dynamic input field. We'll also learn about sending messages and we'll make our todos deletable.
Quickstart Elm 0.19, part 12
Wednesday, October 30, 2019
In this tutorial, we'll see how to add a dynamic input with a button in Elm 0.19. We'll view the building of the app, step by step, and we'll see the result with a live app demo. Learn how to store values in a data structure, and put everything together by building a simple todo app.
Quickstart Elm 0.19, part 11
Tuesday, October 29, 2019
Learn how to add a dynamic input field in Elm 0.19. We'll use this input field to print out to the screen whatever the user types in into the input.
Quickstart Elm 0.19, part 10
Tuesday, October 29, 2019
In this tutorial we'll build an Elm project on our local machine, using VS Code. We'll convert the Bootstrap 4 pricing layout from HTML to Elm, and see how to make our code more modular as we do it.
Quickstart Elm 0.19, part 9
Tuesday, October 29, 2019
What is the main difference between Strings and Records in Elm? We'll compare two very similar apps with a twist: we'll use a String to hold the data in one app (store the model), and in the other one, we'll use a Record (to store the model).
Quickstart Elm 0.19, part 8
Tuesday, October 29, 2019
In this tutorial in learning Elm series of articles, we'll learn about function composition and how to compose them using a few simple live examples.
Quickstart Elm 0.19, part 7
Saturday, October 26, 2019
Elm is a functional language, and in this tutorial we'll learn why and how all functions in Elm are curried, and what it means to say that all curried functions can be partially applied when called. This will help us understand type annotations.
Quickstart Elm 0.19, part 6
Thursday, October 24, 2019
When learning the Elm lang, it's important to understand how List.map and List.filter functions work. We'll discuss higher order functions in Elm and we'll compare a mapping over an array in JS using forEach and mapping over a List in Elm.
Quickstart Elm 0.19, part 5
Thursday, October 24, 2019
In the fifth article of our series on the Elm lang, we'll revisit working with messages in Elm. We'll discuss functions, pattern matching, and case expressions.
Quickstart Elm 0.19, part 4
Wednesday, October 23, 2019
There is a tool to convert HTML to Elm online. We'll learn about it in this tutorial, along with function signatures for HTML elements, how to pass code from view to the main function, how type aliases work, what are primitive types in Elm, and a few more questions and gotchas.
Quickstart Elm 0.19, part 3
Tuesday, October 22, 2019
In the third tutorial of this article series on learning Elm, we'll write a FizzBuzz app. We'll compare it with JS, and we'll play with the live example of the same app in the Elm language.
Objects in JavaScript in Depth
Monday, October 21, 2019
Learn all about objects in JavaScript in this in-depth tutorial on the topic.
The Anatomy of a JavaScript function, part 5
Sunday, October 20, 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
Sunday, October 20, 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.
Quickstart Elm 0.19, part 2
Sunday, October 20, 2019
In the second tutorial of this article series on learning Elm, we'll cover immutable data structures, the Elm architecture (Model, Vie, Message, and Update), and unidirectional data flows. We'll build a simple counter app and learn about modules and the Browser.sandbox function.
Quickstart Elm 0.19, part 1
Sunday, October 20, 2019
In the first article of this article series on learning Elm, we'll see how to install Elm, render text nodes and actual HTML elements on a page. We'll also cover how to nest HTML elements in Elm 0.19.
The Anatomy of a JavaScript function, part 3
Saturday, October 19, 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.
Kaizen, checklists, and doing software presentations
Friday, October 18, 2019
This somewhat philosophical article tackles the preparation for your software presentations from a slightly different angle. It's always good to look at things from a different perspective, and this article does just that.
The Anatomy of a JavaScript function, part 2
Friday, October 18, 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
Friday, October 11, 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
Thursday, October 10, 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
Wednesday, October 9, 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?
Tuesday, October 8, 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
Monday, October 7, 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
Sunday, October 6, 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
Saturday, October 5, 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
Friday, October 4, 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
Thursday, October 3, 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
Tuesday, October 1, 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
Monday, September 30, 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
Monday, September 30, 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
Sunday, September 29, 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
Saturday, September 28, 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
Friday, September 27, 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
Thursday, September 26, 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
Wednesday, September 25, 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
Wednesday, September 25, 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
Wednesday, September 25, 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
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.
nodejs 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 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 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 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 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 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 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 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 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.
HTML and CSS Basics, part 9: Images and floats in CSS
Tuesday, September 17, 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
Tuesday, September 17, 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
Tuesday, September 17, 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, fixed, and sticky positioning
Monday, September 16, 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
Sunday, September 15, 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
Saturday, September 14, 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
Friday, September 13, 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
Friday, September 13, 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
Thursday, September 12, 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
Tuesday, September 10, 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
Tuesday, September 10, 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.
Working with data in Angular 8, part 3
Monday, September 9, 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
Sunday, September 8, 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
Friday, September 6, 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
Friday, September 6, 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.
bootstrap angular ngx-bootstrap
Conditionally showing a text area if a checkbox is checked in Angular 8
Wednesday, September 4, 2019
This Angular tutorial covers a specific use case involving a checkbox which is checked when the app loads. Clicking the checkbox will change the word 'OK' to 'NOT OK', and turn on a textarea to add a comment. If a user clicks the checkbox again after typing a comment, they'll need to confirm that they're cancelling their comment text. In other words, clicking OK erases any possibility of adding...
Rebuilding a Bootstrap 4 pricing example layout in Angular 8
Wednesday, September 4, 2019
This tutorial shows how to build a pricing table theme using the popular Angular framework by Google.
bootstrap angular ngx-bootstrap
Rebuilding an example Bootstrap 4 layout in Angular 8
Tuesday, September 3, 2019
In this tutorial, we'll rebuild an example Bootstrap 4 layout in Angular 8. We'll follow a simple component-building recipe, add a few components, and use a repeater technique to repeat one single card component into 12 repeated components.
bootstrap angular ngx-bootstrap
Working with ngx-bootstrap's typeahead component in Angular 8
Monday, September 2, 2019
How to get the typeahead functionality to work in ngx-bootstrap? Find out in this tutorial.
bootstrap angular ngx-bootstrap
Working with ngx-bootstrap's rating, sortable, timepicker, and tooltip components in Angular 8
Sunday, September 1, 2019
How to work with ngx-bootstrap's rating, sortable, timepicker, and tooltip components in Angular 8? Learn with this blog post from walk-though step by step examples and supporting ready-to-use source-code on Stackblitz.
bootstrap angular ngx-bootstrap
Working with ngx-bootstrap modals, pagination, popover, and progress bars in Angular 8
Friday, August 30, 2019
In this tutorial, we'll work with ngx-bootstrap modals, pagination, popovers, and progress-bar components. We'll see how they work in a live Stackblitz example.
bootstrap angular ngx-bootstrap
Working with ngx-bootstrap buttons, carousel, datepicker, and dropdowns in Angular 8
Wednesday, August 28, 2019
Learn how to work with ngx-bootstrap components: buttons, carousel, datepicker, adn dropdowns; practical examples and live Stackblitz implementation provided.
bootstrap angular ngx-bootstrap
Working with ngx-bootstrap alerts in Angular 8
Wednesday, August 28, 2019
How to work with alerts in ngx-bootstrap? In this tutorial, we'll go through the steps of adding and manipulating alerts in ngx-bootstrap using Stackblitz.
bootstrap angular ngx-bootstrap
Working with ngx-bootstrap tabs in Angular 8
Tuesday, August 27, 2019
How to use ngx-bootstrap tabs in Angular 8? Read about it in this article with detailed instructions.
How to prototype Bootstrap 4 layouts with Angular 8, part 2
Monday, August 26, 2019
Use ngx-bootstrap to build a Bootstrap-styled navbar with the help of the collapse component. Step-by-step instructions are supported by GitHub commits and a live code example. We'll also examine how to animate our navigation toggle.
How to prototype Bootstrap 4 layouts with Angular 8, part 1
Saturday, August 24, 2019
Use ngx-bootstrap to build a simple accordion component from scratch. This tutorial is available on GitHub as well. Follow this guide while we build the ngx-bootstrap accordion step by step. The live code example is also available.
Add a custom pipe to Angular 8
Thursday, August 22, 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).
Building Apps With Angular
Monday, April 29, 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
Saturday, April 6, 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.
Merge two arrays using values of nested object in one of the two arrays
Sunday, March 24, 2019
Array fun ahead! How to merge two complex array into a single one? This is a practical exercises from one of the projects I was working on in my dayjob - adjusted so that it is more generalized and applicable as a tutorial.
10 Reasons to Choose JavaScript As Your First Coding Language
Monday, March 18, 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.
Useful Ubuntu tips and tricks
Friday, March 1, 2019
In this article, I'm documenting some Linux (Ubuntu) tips and tricks I've learned in my coding jobs over the years.
An In-Depth Introduction To Start Coding in PHP Today
Thursday, January 31, 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..
Top 10 Plagiarism Checkers Online
Friday, January 11, 2019
What are some popular plagiarism checkers online - find out in this post, where we examine 10 popular alternatives online.
You're worth what you say you're worth
Friday, January 11, 2019
Pricing your services is a sensitive topic for freelancers and solopreneurs out there. In this article we discuss how to raise price and still keep your clients.
What is internet marketing
Friday, January 11, 2019
In this article we'll go over the basics of internet marketing: what it is, why learn about it, and what it can get you.
Make your business your business
Friday, January 11, 2019
Being a solopreneur is hard, and in this day and age of information overload, it's easy to lose track of the one thing that matters: your business, why you started, and where it's going.
Getting Started Working At PeoplePerHour.com in 2019
Sunday, December 9, 2018
It's good to have choices, and there are plenty of choices of freelancing platforms online. Here's how to get started with PeoplePerHour.com.
5 Reasons Why You Must Have an Ongoing Freelancing Gig
Sunday, December 9, 2018
You've probably heard the term gig economy. In this article we'll discuss why it's good to have a side-gig of your own, and why it's even better if it's ongoing
The anatomy of a JavaScript function, part 1
Monday, December 3, 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.
Using 5000 LinkedIn Connections To Promote A Brand New Blog (Part 1)
Thursday, November 15, 2018
In this article, I tried to use a LinkedIn account with 5000 connections to share a tutorial from this website and see the result. It worked out differently from what I expected.
The One Reason You Must Start A Blog in 2019
Thursday, November 15, 2018
This article is one year old. It's a testament of the importance of starting a blog and going at it. It's not too late, no matter what you might think! Start your blog today! This article tells you why you should.
10 Ways to Stay Motivated And Productive As A Side Hustler
Wednesday, November 14, 2018
This post gives you some practical advice on how to stay productive and healthy when you're burning the candle on both sides.
135-plus Amazing Side Hustle Quotes to Get You Into The Zone
Monday, November 12, 2018
Whatever we're striving for in life, we're bound to hit a rough patch here and there. Here are 135+ side hustle quotes to help you overcome bottlenecks and get you into the zone.
Course Creators, You Should Focus on Your Students' Results
Thursday, November 8, 2018
If you're an author of a coding course, this article is for you. In it, we'll discuss ways to make your courses better by thinking about your audience more.
Table border css
Friday, October 19, 2018
In this quick tip tutorial, we see how easy it is to add a border to a table HTML element using CSS, in all the different ways.
40+ books every developer should read
Thursday, October 18, 2018
In this article we'll have a look at the list of over forty books every software developer should have on their reading list.