Tag: beginners

VS Code tips and tricks for beginners
24 Feb 2021
VS Code gotchas, tips, tricks, and experiences from working with the framwork can be found in thi...
Jira tips and tricks for beginners
23 Feb 2021
Jira gotchas, tips, tricks, and experiences from working with the framwork can be found in this a...
Alpine.js tips and tricks for beginners
23 Feb 2021
Alpine.js gotchas, tips, tricks, and experiences from working with the framwork can be found in t...
Tailwind tips and tricks for beginners
22 Feb 2021
Tailwind.css gotchas, tips, tricks, and experiences from working with the framwork can be found i...
Composer tips and tricks for beginners
22 Feb 2021
In this post, we list lessons and gotchas picked up while working with Composer.
Useful Docker tips and tricks
21 Feb 2021
In this article, I'm listing the Docker-related tips and tricks I've learned while working with D...
Vue.js tips and tricks
11 Feb 2021
Looking for Vue.js tips and tricks? This ever-growing list of tips and tricks in using Vue.js com...
Build the smallest possible Vue app
10 Feb 2021
In this gentle introduction to Vue.js we'll learn about the basic ins and outs of this modern JS ...
Hoisting differences related to keywords var, let and const in JS
27 Jan 2021
We all know that the var keyword should not be used in our code, and that we should mostly use le...
Find the key code for a keydown or keyup event in JavaScript
27 Jan 2021
Key up and key down events in JS return a bunch of information in the Event object. This informat...
Using cookies in JavaScript
26 Jan 2021
Cookies are one of the oldest ways of saving text-based data on the web. The data that gets saved...
Convert an object to array in JS
22 Jan 2021
Converting an object to an array is pretty easy in JavaScript. All we have to do is use Object.ke...
Get an object's length in JavaScript
21 Jan 2021
To get the length of an object in JS, we use Object.keys() to get an array of our object's own pr...
Build a multi-dimensional array in JavaScript
18 Jan 2021
How to build matrices in JS? Also known as multi-dimensional arrays, these are just arrays of arr...
Convert kebab case to camel case in JavaScript
18 Jan 2021
It's the combination of String.prototype.match(), RegExp, and String.prototype.replace() that giv...
Capitalize the first letter of a string in JavaScript
18 Jan 2021
The trick is to separate the string into the first letter and the rest of the string using charAt...
Insert CSS styles with JavaScript
17 Jan 2021
Appending a style tag to the head tag of an HTML document requires some simple DOM manipulation. ...
Compute the factorial of a number with JavaScript
17 Jan 2021
Calculating a factorial is very easy, but many JS implementations online make this problem unnece...
Calculate the Fibonacci sequence in JS
16 Jan 2021
Fibonacci sequence in JS should not be hard to build. In this article, we show step-by-step, how ...
Count the number of times a substring appears in a string in JavaScript
15 Jan 2021
Have you ever tried to see how many times a letter or a word appears in a string? Or how many tim...
Convert an array of numbers to an array of ordinal numbers in JS
14 Jan 2021
To format an array of numbers as ordinal numbers, we need to properly add the suffixes -st, -nd, ...
Format a number as currency in JS
13 Jan 2021
Formatting a number as currency in JS is easy. We can use Intl.NumberFormat(), and style it as cu...
Format a number with comma as a thousands separator in JS
12 Jan 2021
In JS, we can add a comma as thousands separator using the toLocaleString() method, or using Intl...
Generate a random sub-array from a larger array
11 Jan 2021
To get a random, three-member sub-array from an array of items, we need to use the splice, Math.r...
Add random CSS classes to a paragraph in JavaScript
10 Jan 2021
We have a web page with a script tag. That script tag holds an array of various Bootstrap 4 CSS c...
Generate a random password with JavaScript
09 Jan 2021
We can easily whip up our own password generator in vanilla JS. This tutorial shows you how to do...
Randomize the order of members in a JavaScript array
08 Jan 2021
Randomly reordering members of a JavaScript array might seem an easy task, but it can also be dif...
Get a number randomly from a range of numbers in JS
07 Jan 2021
Math.random() gives us a range between 0 (inclusive) and 1 (exclusive). But how do we use this me...
Randomly return a true or false from a JavaScript function
07 Jan 2021
Using the conditional (ternary) operator, we are able to easily return, at random, either a boole...
Pick a random member from a JavaScript array
06 Jan 2021
Multiply the length of array with the call to Math object's random method, then floor the result....
Emulate a six-sided dice
05 Jan 2021
Use Math.random() static method to emulate a pair of dice in JavaScript, and keep in mind these s...
Magento 2 tips and tricks for beginners
20 Dec 2020
In this post, we list lessons and gotchas picked up while learning Magento 2.
Objects vs non-objects in JavaScript
12 Dec 2020
This article discusses the difference between objects and non-objects in the JavaScript language.
CSS position sticky
25 Sep 2020
Position:sticky in CSS; what is it, how it works, and a few practical examples can be found in th...
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...
MVC in Ruby on Rails
18 Dec 2019
This article explains the concept of MVC (Model - View - Controller), as it is implemented in Rub...
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...
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 ti...
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 ...
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...
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...
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 i...
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 fi...
Learning PHP, part 3
19 Nov 2019
In this beginner-friendly tutorial on PHP, we'll cover functions, arrays, objects, classes, and r...
Learning PHP, part 2
18 Nov 2019
Learn the basics of PHP syntax in this approachable tutorial for beginners. We cover the basics o...
Learning PHP, part 1
17 Nov 2019
Start learning PHP from scratch, starting with this first article dealing with php installation a...
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-friend...
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, beginne...
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 an...
What are events in JavaScript
08 Nov 2019
JavaScript inline event handlers, event propagation, event bubbling and capturing, the Event obje...
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...
Useful JavaScript snippets
03 Nov 2019
This article lists a number of various snippets, tips, and tricks in JavaScript. This is an open-...
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...
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 t...
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, ...
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 ...
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...
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 ...
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 p...
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 lea...
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 ...
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 layou...
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 Bootst...
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 start...
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. ...
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 c...
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 mak...
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'l...
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. Addi...
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 co...
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 develope...
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? Le...
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 tha...
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...
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 twe...
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 f...
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 a...
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 o...
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,...
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 b...
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 alo...
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 flexbo...
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 tutor...
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 p...
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 ...
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 brow...
All the CSS selectors
17 Sep 2019
All the CSS selectors with examples are listed in this one single article. Learn about more than ...
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,...
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 le...
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 tutoria...
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 d...
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...
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 que...
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 p...
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 sel...
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 app...
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 an...
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 app...
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 s...
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 ...
Working with BootstrapVue accordions
04 Jun 2019
This article shows how to work with BootstrapVue accordions. There are several options that we ca...
Getting started with Github for beginners
04 May 2019
This article is a gentle introduction to GitHub for complete beginners. Learn the basics of GitHu...
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 Ang...
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 expan...
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 th...
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 exa...
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 functio...
Table border css
19 Oct 2018
In this quick tip tutorial, we see how easy it is to add a border to a table HTML element using C...