Tag: beginners

15 Jun 2021
9 Ideas to Learn Web Develpment Faster and Easier
In this article, I'm sharing insights I've learned through the years of working in all kinds of I...
24 Feb 2021
VS Code tips and tricks for beginners
VS Code gotchas, tips, tricks, and experiences from working with the framwork can be found in thi...
23 Feb 2021
Jira tips and tricks for beginners
Jira gotchas, tips, tricks, and experiences from working with the framwork can be found in this a...
23 Feb 2021
Alpine.js tips and tricks for beginners
Alpine.js gotchas, tips, tricks, and experiences from working with the framwork can be found in t...
22 Feb 2021
Tailwind tips and tricks for beginners
Tailwind.css gotchas, tips, tricks, and experiences from working with the framwork can be found i...
22 Feb 2021
Composer tips and tricks for beginners
In this post, we list lessons and gotchas picked up while working with Composer.
21 Feb 2021
Useful Docker tips and tricks
In this article, I'm listing the Docker-related tips and tricks I've learned while working with D...
11 Feb 2021
Vue.js tips and tricks
Looking for Vue.js tips and tricks? This ever-growing list of tips and tricks in using Vue.js com...
10 Feb 2021
Build the smallest possible Vue app
In this gentle introduction to Vue.js we'll learn about the basic ins and outs of this modern JS ...
27 Jan 2021
Hoisting differences related to keywords var, let and const in JS
We all know that the var keyword should not be used in our code, and that we should mostly use le...
27 Jan 2021
Find the key code for a keydown or keyup event in JavaScript
Key up and key down events in JS return a bunch of information in the Event object. This informat...
26 Jan 2021
Using cookies in JavaScript
Cookies are one of the oldest ways of saving text-based data on the web. The data that gets saved...
22 Jan 2021
Convert an object to array in JS
Converting an object to an array is pretty easy in JavaScript. All we have to do is use Object.ke...
21 Jan 2021
Get an object's length in JavaScript
To get the length of an object in JS, we use Object.keys() to get an array of our object's own pr...
18 Jan 2021
Build a multi-dimensional array in JavaScript
How to build matrices in JS? Also known as multi-dimensional arrays, these are just arrays of arr...
18 Jan 2021
Convert kebab case to camel case in JavaScript
It's the combination of String.prototype.match(), RegExp, and String.prototype.replace() that giv...
18 Jan 2021
Capitalize the first letter of a string in JavaScript
The trick is to separate the string into the first letter and the rest of the string using charAt...
17 Jan 2021
Insert CSS styles with JavaScript
Appending a style tag to the head tag of an HTML document requires some simple DOM manipulation. ...
17 Jan 2021
Compute the factorial of a number with JavaScript
Calculating a factorial is very easy, but many JS implementations online make this problem unnece...
16 Jan 2021
Calculate the Fibonacci sequence in JS
Fibonacci sequence in JS should not be hard to build. In this article, we show step-by-step, how ...
15 Jan 2021
Count the number of times a substring appears in a string in JavaScript
Have you ever tried to see how many times a letter or a word appears in a string? Or how many tim...
14 Jan 2021
Convert an array of numbers to an array of ordinal numbers in JS
To format an array of numbers as ordinal numbers, we need to properly add the suffixes -st, -nd, ...
13 Jan 2021
Format a number as currency in JS
Formatting a number as currency in JS is easy. We can use Intl.NumberFormat(), and style it as cu...
12 Jan 2021
Format a number with comma as a thousands separator in JS
In JS, we can add a comma as thousands separator using the toLocaleString() method, or using Intl...
11 Jan 2021
Generate a random sub-array from a larger array
To get a random, three-member sub-array from an array of items, we need to use the splice, Math.r...
10 Jan 2021
Add random CSS classes to a paragraph in JavaScript
We have a web page with a script tag. That script tag holds an array of various Bootstrap 4 CSS c...
09 Jan 2021
Generate a random password with JavaScript
We can easily whip up our own password generator in vanilla JS. This tutorial shows you how to do...
08 Jan 2021
Randomize the order of members in a JavaScript array
Randomly reordering members of a JavaScript array might seem an easy task, but it can also be dif...
07 Jan 2021
Get a number randomly from a range of numbers in JS
Math.random() gives us a range between 0 (inclusive) and 1 (exclusive). But how do we use this me...
07 Jan 2021
Randomly return a true or false from a JavaScript function
Using the conditional (ternary) operator, we are able to easily return, at random, either a boole...
06 Jan 2021
Pick a random member from a JavaScript array
Multiply the length of array with the call to Math object's random method, then floor the result....
05 Jan 2021
Emulate a six-sided dice
Use Math.random() static method to emulate a pair of dice in JavaScript, and keep in mind these s...
20 Dec 2020
Magento 2 tips and tricks for beginners
In this post, we list lessons and gotchas picked up while learning Magento 2.
12 Dec 2020
Objects vs non-objects in JavaScript
This article discusses the difference between objects and non-objects in the JavaScript language.
25 Sep 2020
CSS position sticky
Position:sticky in CSS; what is it, how it works, and a few practical examples can be found in th...
07 Mar 2020
Replace all instances of a CSS class using vanilla JS
How to use vanilla JavaScript to replace all instances of a CSS class with another CSS class on a...
18 Dec 2019
MVC in Ruby on Rails
This article explains the concept of MVC (Model - View - Controller), as it is implemented in Rub...
18 Dec 2019
Before you build your first app in Rails 6
In this article, we'll go into a number of concepts to learn before starting to code real apps in...
05 Dec 2019
The Ultimate List of Productivity Boosters for Developers
Productivity can be hard to improve, even if you're a talented web developer. Here's a list of ti...
03 Dec 2019
Multiplication table using nested for loops
Nested for loops in JavaScript can help us with a number of coding tasks. In this article, we'll ...
02 Dec 2019
Working with maps in JavaScript
The map data structure is another data structure in JS that derives from the Object prototype. In...
02 Dec 2019
Working with arrays in JavaScript
JS array prototype, array methods, array use cases, and a number of tips and tricks - we're going...
01 Dec 2019
Working with sets in JavaScript
This is an in-depth introduction to sets in JavaScript. A set is a special kind of a collection i...
27 Nov 2019
Random and Useful Coding Tips
In this tutorial, we list a number of tips and tricks that are related to coding, but can only fi...
19 Nov 2019
Learning PHP, part 3
In this beginner-friendly tutorial on PHP, we'll cover functions, arrays, objects, classes, and r...
18 Nov 2019
Learning PHP, part 2
Learn the basics of PHP syntax in this approachable tutorial for beginners. We cover the basics o...
17 Nov 2019
Learning PHP, part 1
Start learning PHP from scratch, starting with this first article dealing with php installation a...
10 Nov 2019
Write a simple quiz app in JavaScript
How to write a very simple quiz app in JavaScript? Find out in this introductory, beginner-friend...
10 Nov 2019
Write a simple todo app in JavaScript
How to write a very simple todo app in vanilla JavaScript? Find out in this introductory, beginne...
08 Nov 2019
Helpful tricks to learn JavaScript
What are the ways to improve you JavaScript coding skills? How to get better faster? Are there an...
08 Nov 2019
What are events in JavaScript
JavaScript inline event handlers, event propagation, event bubbling and capturing, the Event obje...
08 Nov 2019
Filter Google search results with JavaScript
The ability to use JavaScript right in the browser, via the devtools console, opens up a world of...
03 Nov 2019
Useful JavaScript snippets
This article lists a number of various snippets, tips, and tricks in JavaScript. This is an open-...
20 Oct 2019
The Anatomy of a JavaScript function, part 5
There are well over a dozen ways to define a function in JavaScript. In this fifth article of the...
20 Oct 2019
The Anatomy of a JavaScript function, part 4
How to use the function arguments and how are they related to the ES6 speread operator? This is t...
19 Oct 2019
The Anatomy of a JavaScript function, part 3
What are the differences between ES5 and ES6 functions? We answer this question in this article, ...
18 Oct 2019
The Anatomy of a JavaScript function, part 2
How to generalize functions in JavaScript? Learn all about it in this second part of the Anatomy ...
11 Oct 2019
Building Bootstrap 4 layouts, part 12: Build a Shopify clone layout
See how to clone a Shopify homepage layout in Bootstrap 4. We'll go step by step, from setting up...
10 Oct 2019
Start a minimal Express app with npm
Here's a quick and easy introduction to Express and Node.js. Learn how to build a simple Express ...
09 Oct 2019
Building Bootstrap 4 layouts, part 11: Build an AirBnB clone layout
See how to clone an AirBnB homepage layout in Bootstrap 4. We'll use the live AirBnB website to p...
08 Oct 2019
Should I first learn vanilla JavaScript or Angular?
It's hard to choose what to learn in web development when there are so many options: should I lea...
07 Oct 2019
Building Bootstrap 4 layouts, part 10: Build a Bootstrap 4 layout and track it with Git
See how to build a Bootstrap 4 layout step-by-step with the help of GitHub so that you can track ...
06 Oct 2019
Building Bootstrap 4 layouts, part 9: Build another Bootstrap layout in Angular
This tutorial shows how to cherry-pick Bootstrap 4 components to quickly build a Boostrap 4 layou...
05 Oct 2019
Building Bootstrap 4 layouts, part 8: Modularize your Bootstrap layouts
In part 8 of Building Bootstrap layouts tutorial series, we'll learn how to modularize our Bootst...
04 Oct 2019
Building Bootstrap 4 layouts, part 7: Building a typography-focused layout
In this tutorial we'll build a complete Boostrap 4 layout based on the official Bootstrap 4 start...
03 Oct 2019
Building Bootstrap 4 layouts, part 6: Working with SCSS in Bootstrap 4
In this tutorial we'll upgrade the Checkout from example from the official getbootstrap website. ...
01 Oct 2019
Building Bootstrap 4 layouts, part 5: Improving Bootstrap's official examples
Let's upgrade the official Pricing example layout from the official getbootstrap website. We'll c...
30 Sep 2019
Building Bootstrap 4 layouts, part 4: Improving Bootstrap's official examples
Let's upgrade the official Album example layout from the official getbootstrap website. We'll mak...
30 Sep 2019
Building Bootstrap 4 layouts, part 3: Bootstrap components
What are components in Boostrap 4? We can divide them into primary and secondary components. We'l...
29 Sep 2019
Building Bootstrap 4 layouts, part 2: Rows and responsive columns
Learn about Bootstrap 4's column grid and build a simple responsive layout in this tutorial. Addi...
28 Sep 2019
Building Bootstrap 4 layouts, part 1: Containers and contextual colors
Learn about Bootstrap containers and about the difference between regular containers and fluid co...
27 Sep 2019
HTML and CSS Basics, part 24: CSS tips and tricks for beginners
This article shows 10 practical tips and tricks in CSS for beginners and junior frontend develope...
26 Sep 2019
HTML and CSS Basics, part 23: CSS grid
What is the difference between CSS flexbox and CSS grid? How to use the former and the latter? Le...
25 Sep 2019
HTML and CSS Basics, part 22: CSS variables
This tutorial is a genle introduction to CSS variables. We'll start with a CSS example layout tha...
25 Sep 2019
HTML and CSS Basics, part 21: CSS animations and transitions
Learn the basics of using CSS transitions and animations, what makes them similar, and what makes...
25 Sep 2019
HTML and CSS Basics, part 20: Building a layout with Bootstrap
How to build a simple layout with Bootstrap 4? We'll learn all about it in this tutorial, the twe...
25 Sep 2019
HTML and CSS Basics, part 19: Building a layout with our micro CSS framework
In this tutorial, we'll continue learning HTML and CSS layout techniques by using the micro CSS f...
24 Sep 2019
HTML and CSS Basics, part 18: Build your own micro CSS framework
This practical tutorial shows how to build your own CSS micro-framework. This tutorial is aimed a...
23 Sep 2019
HTML and CSS Basics, part 17: Introduction to SCSS
In this introduction to SCSS and Sass, we'll see how to easily get started with these supersets o...
21 Sep 2019
HTML and CSS Basics, part 16: Frontend CSS frameworks
In this tutorial, we go through an overview of a few very popular frontend frameworks: Bootstrap,...
21 Sep 2019
HTML and CSS Basics, part 15: Column-based CSS layouts
What are column-based CSS layouts and what led to them? What problems do they solve, and how to b...
20 Sep 2019
HTML and CSS Basics, part 14: CSS resets and Emmet
Emmet helps us write HTML and CSS code faster. In this tutorial, we learn the basics of Emmet alo...
20 Sep 2019
HTML and CSS Basics, part 13: Converting our first layout into a responsive one
In this tutorial we'll convert a static HTML layout into a responsive one. We'll introduce flexbo...
19 Sep 2019
HTML and CSS Basics, part 12: Responsive web layouts with media queries
With media queries, we can build layouts that respond to devices they're viewed on. In this tutor...
19 Sep 2019
HTML and CSS Basics, part 11: Building the first layout
In this tutorial, we'll build our first HTML and CSS layout. We'll learn about mocking up a web p...
17 Sep 2019
HTML and CSS Basics, part 9: Images and floats in CSS
In this tutorial we learn all about images and floats in CSS. We see how floats were used in the ...
17 Sep 2019
HTML and CSS Basics, part 10: CSS selectors and CSS targeting revisited
Learn about the most commonly used CSS selectors, and the role of CSS specificity in how the brow...
17 Sep 2019
All the CSS selectors
All the CSS selectors with examples are listed in this one single article. Learn about more than ...
16 Sep 2019
HTML and CSS Basics, part 8: Relative, absolute, fixed, and sticky positioning
In this tutorial we'll examine the differences between relative, absolute, and fixed positioning,...
15 Sep 2019
HTML and CSS Basics, part 7: CSS positioning
What is CSS positioning about? How does relative positioning work with top, right, bottom, and le...
14 Sep 2019
HTML and CSS Basics, part 6: the box model
What is the box model in CSS and how to preview it in our browser's developer tools? This tutoria...
13 Sep 2019
HTML and CSS Basics, part 5: block vs inline elements
In the fifth article in our series titled HTML and CSS basics, we discuss the interplay between d...
13 Sep 2019
HTML and CSS Basics, part 4: controlling document flow via display property
We can control the document flow of HTML documents using the display property in CSS. This allows...
12 Sep 2019
HTML and CSS Basics, part 3: CSS element selectors VS class selectors
How to style block-level HTML elements? How to style them using CSS classes? We discuss these que...
10 Sep 2019
HTML and CSS Basics, part 2: normal document flow, block elements, inline elements
In the second article of our HTML and CSS basics, we'll learn about normal document flow of web p...
10 Sep 2019
HTML and CSS Basics, part 1: whitespace, HTML elements, and CSS selectors
We'll begin learning HTML and CSS basics by learning about whitespace, HTML elements, and CSS sel...
09 Sep 2019
Learning JavaScript basics by coding tiny apps, part 2
When you're learning to code, it's always a good idea to try to build apps on your own. These app...
09 Sep 2019
Working with data in Angular 8, part 3
In this intro tutorial on working with data in Angular, we'll learn how to loop over some data an...
08 Sep 2019
Learning JavaScript basics by coding tiny apps
When you're learning to code, it's always a good idea to try to build apps on your own. These app...
06 Sep 2019
Working with data in Angular 8, part 2
In this beginner-friendly article we continue our exploration of how to work with data in Angular.
06 Sep 2019
Working with data in Angular 8, part 1
How to work with data in Angular? That's what this beginner-friendly tutorial is about. Using a s...
22 Aug 2019
Add a custom pipe to Angular 8
In this hands-on tutorial, learn how to add a custom pipe to your Angular app. Live code example ...
04 Jun 2019
Working with BootstrapVue accordions
This article shows how to work with BootstrapVue accordions. There are several options that we ca...
04 May 2019
Getting started with Github for beginners
This article is a gentle introduction to GitHub for complete beginners. Learn the basics of GitHu...
29 Apr 2019
Building Apps With Angular
Angular app ideas can be found in this list of Angular apps that one can build while learning Ang...
06 Apr 2019
How to Write Better PHP: An Ultimate List of Tips for PHP Beginners
PHP beginners will find some great tips and tricks regarding PHP here. This article is ever expan...
18 Mar 2019
10 Reasons to Choose JavaScript As Your First Coding Language
If you're planning to start learning a coding language, you can't go wrong with JavaScript. In th...
31 Jan 2019
An In-Depth Introduction To Start Coding in PHP Today
In-depth PHP basics for newbie web developers, how to get started quickly, and some practical exa...
03 Dec 2018
The anatomy of a JavaScript function, part 1
This tutorial compares JS functions to simple machines. We go step by step, building a JS functio...
19 Oct 2018
Table border css
In this quick tip tutorial, we see how easy it is to add a border to a table HTML element using C...