Articles

Using Fetch

Whenever we send or retrieve information with JavaScript, we initiate a thing known as an Ajax call. Ajax is a technique to send and retrieve information behind the scenes without needing to refresh the page. It allows browsers to send and retrieve information, then do things with what it gets back, like add or change HTML on the page.

Altering the DOM with JavaScript

If you’re learning JavaScript, the first thing you should learn (after understanding the basics like variables, functions, etc.) is to alter the DOM. This is one of the things you do daily as a frontend developer.

Changing the DOM used to be difficult. We needed jQuery to make things easier. Luckily, there’s no need for jQuery anymore.

In this article, I’ll show you the things you need to be familiar with as a frontend developer.

Breaking the rules

If you read my past articles on CSS architecture, you would have noticed I took parts of techniques created by experts and mixed them into a set of rules that I follow. Some of my rules helped others understand how to use a technique, while others sparked public outrage (like my unconventional BEM usage. People exclaimed that I broke BEM rules).

I’d like to confess today that I broke more rules than that. Breaking rules is my way of finding out what to take in from techniques mentioned by experts. It’s also my way of figuring what to change to adapt to my personal belief. Today, I’d like to dig into this rule-breaking process.

Writing modular CSS (Part 3) — CSS file structure

We’ve already talked about writing Modular CSS with BEM and namespaces in the past two articles. In this article, I want to veer away from the process of writing CSS selectors into the mystical art of file structure and organization.

If you’ve ever wondered what’s the best practice for organizing files, how to find any CSS file easily and how big or small each file should be, this article is written for you.

Writing modular CSS (Part 2) — Namespaces

Last week, I shared how I use BEM to create a sensible CSS architecture. Although BEM is awesome, it’s only part of the solution. There’s another part I’ve yet to mention — namespaces.

In this article today, I want to share with you why BEM isn’t enough and how I use namespaces to bridge the gap.

Writing modular CSS (Part 1) — BEM

Have you worked on large websites that spans more than a few pages? If you did, you probably realized the horrors of not conforming to a robust CSS architecture. You probably would also have researched on ways to write maintainable CSS.

Since our industry is awesome, we don’t only have one recommended solution. Experts have jumped in and provided us with suggestions like BEM, OOCSS, SMACSS, Atomic Design and many others.

Now, instead of suffering from “I don’t know what to do”, the question becomes: “there’s so many ways. Which should I try?” Should I use everything, only one approach or create a custom architecture from the possible picks out there?.

I started off with only one approach. Then, as I tried different approaches, I began to include what I thought made sense into my process. In this article, I want to share with you how I structure my CSS and why I do so. Hopefully, it’ll help you find your preferred method.

Should you learn [insert shiny new tool]?

Oh look! Everyone is talking about Webpack now! Should I upgrade my workflow to use Webpack?!

“Hmmmmm… Maaaybe I should use PostCSS since expert X highly recommends it. I can’t decide…”

“OH WOW. FACEBOOK USES REACT! REACT MUST BE HAWT! I NEED TO LEARN THAT TOO!”

Are you familiar with any of these conversations? It’s not surprising if you are! New tools pop up in the frontend world incredibly quickly. Whenever something new pops up, people scream about how cool it is. Even industry experts begin using them. Heck, the expert you love and follow may even recommend you to use them!

Do you feel pressured to try the new tool out? Do you feel like a shitty developer if you don’t keep up with the latest tools?

If you do, you’re not alone!

Today, I want to share with you a simple framework to determine if you should learn/switch to [insert shiny tool]. Read on if it sounds any interesting.

How to pair typefaces

The act of choosing two typefaces is probably the first (and often most difficult) task you do when creating a new design. Many people get stuck here, myself included.

Recently, I discovered a simple method to pair typefaces effectively and I’d love to share them with you. (Hint: it’s a 3×3 grid).

Fighting decision paralysis

It’s common for designers and web developers to suffer from decision paralysis. You know you’ve battled with it if you had problems like:

  1. Spending hours choosing the right typefaces
  2. Obsessing over choosing the right framework
  3. Scratching your head over what to learn next
  4. Facing writer’s block

Does any of them sound familiar?

Decision paralysis has been the bane of my life so far. I battled against it again recently and I’m happy to say I finally got out of the rut (today!).

In this article, I’d love to share my experiences with you and how I handle decision paralysis.

Hold on while i sign you up…

🤗
Woohoo! You’re in!
Now, hold on while I redirect you.