I’m sure you’ve come across the word JAMstack before but you probably didn’t understand what it really meant. I’ve seen this word before also but didn’t care to check it out until Egwuenu Gift organized JAMstack Lagos, then I realised that I’ve been building JAMstack applications already. JAMstack is a Modern web development architecture, it is not a programming language or any form of tool. It is more of a web development practice aimed towards enforcing better performance, higher security, lower cost of scaling, and better developer experience.

Google believes that open source is good for everyone. By being open and freely available, it enables and encourages collaboration, development of technology and solving real-world problems. Over the years, Google has created a healthy ecosystem for the sustainability of open source for all via its several communities Beyond the open source software we directly use and release at Google, we also work to support the sustainability of open source organizations and communities.

ES6 has brought several new features and methods into JavaScript since its release. These features have better improved our workflow and productivity as JavaScript developers. Amongst these new features are Object.freeze() method and const . It is argued among a few developers especially newbies that these two feature works the same way, but NO it doesn’t. Object.freeze() and const work differently. Let me show you how! const and Object.freeze() are totally different.

As developers, it’s easy to assume that all users can see and use a keyboard, mouse or screen, you feel everyone can interact with your web page the same way you do. This can lead to a user experience that works well for some people but creates issues for others :( Many developers have only a little or blurred understanding of what accessibility means, of course, accessibility can be a complex and difficult topic but understanding it, its scope and its impact can make you a better and inclusive web developer.

Progressive Web Apps are very much in use by some of the biggest companies like Twitter, Forbes, Alibaba, Instagram, Flipkart e.t.c and have gained popularity. Building a PWA is quite easy and simple. In this tutorial, we’re going to build a simple Progressive web app (A weight converter app). Let’s roll :) TABLE OF CONTENTS Introduction Starter files App description Building the UI Add JavaScript Functionality Build the Progressive Web App Deploy to Netlify Conclusion INTRODUCTION I’m sure by now you must have heard or read about Progressive Web Applications.

In the past years, maintaining CSS was a very big problem for bigger projects or complex apps as a result, building reusable components and cleaner styles were hard to achieve. CSS Preprocessors came to solve this problem and have been around for years now (SASS, LESS, e.t.c). They extend CSS with key features like variables, operators, interpolations, functions, imports, mixins e.t.c. However, in Modern CSS, we now have a new powerful feature called Custom properties, otherwise known as CSS variables or cascading variables.

Hugo is a fast and modern static site generator written in Go, and designed to make website creation fun again. It builds pages when you create or update your content. Websites built with Hugo are extremely fast and secure like https://bolajiayodeji.com. In technical terms, Hugo takes a source directory of files and templates and uses these as input to create a complete website. Hugo sites can be hosted anywhere, including Netlify, Heroku, GoDaddy, DreamHost, GitHub Pages, GitLab Pages, Surge, Aerobatic, Firebase, Google Cloud Storage, Amazon S3, Rackspace, Azure, and CloudFront and work well with CDNs.

Developers tend to know how to iterate through JavaScript Arrays easily but most times they tend to get confused while working with JavaScript Objects especially beginners and intermediates. In this article, I’d show you Five (5) different ways of iterating through JavaScript Objects and some performance comparison tests to show you which is faster and more efficient. * Useful tips :) Property flags Object properties, besides a value, have three special attributes (also known as “flags”):

There’s no substitute for hands-on experience, but for most students, real-world tools can be quite expensive. That’s why GitHub created the GitHub Student Developer Pack to give students free access to the best developer tools in one place so they can learn by doing. In this article, I’d take you through: What is GitHub Student Developer Pack Contents of the pack Terms and Conditions How to apply for the pack Expiration and renewals Let’s roll :)

The files and directories within a repository determine the languages that make up the repository. With GitHub, you can view a repository’s languages to get a quick overview of the repository. But how does this happen? What powers this repository language overview? In this article I would: Introduce you to GitHub Linguist How it works How to fix common Linguist issues How to use gitattributesto override Linguist :) How to use Emacs or Vim modelines to override Linguist How to contribute to GitHub Linguist Let’s Roll!

Git cheat sheet saves you time when you just can’t remember a specific command. It is hard to memorize all the important Git commands as a newbie, most times Senior Developers forget too. This is why you need a reference you can come back to when you get stuck. In this article, I’d show you the basic Git commands to help you learn Git, and more advanced concepts around Git branches, remote repositories, reverting changes, and more.

As earlier stated in my previous article ES6 modules is a very powerful concept. Although support is not available everywhere yet, a common way of using it is to transpile into ES5. You can use Grunt, Gulp, Webpack, Babel or some other transpiler to compile the modules during a build process. In this article, I’d guide through an introduction to transpiling ES6 with babel and bundling your modules with Browserify.

An essential aspect of software engineering is efficiency. Every successful app needs a solid architectural structure that allows it to scale at all levels without breaking. In respect to this, several techniques and patterns are engaged to ensure code efficiency. In this article, I would introduce you to ES6 modules, what they are, how to use them and why you should care {0[]0} What exactly is a module? In JavaScript, the word “modules” refers to small units of independent, reusable code.

Arrays have become an important part of any programming language. Most times we need to do several operations on arrays, hence this article. In this article, I would show you various methods of manipulating arrays in JavaScript [^^] What are Arrays in JavaScript? Before we proceed, you need to understand what arrays really mean. In JavaScript, an array is a variable that is used to store different data types.

Chrome Lighthouse has been around for a while now, but what if I ask you to explain what it does can you explain vividly? I discovered that a lot of web developers, including beginners, have not heard about this tool and those who have, have not tried it yet, that’s not cool :(. In this article, I would introduce you Chrome Lighthouse, what it does and how to start using it.