From the Blog
Here are the latest posts from my blog.
I cover mostly frontend, JAMstack, WordPress, and freelancing topics.
Did you know that I am running UI Dev Newletter? Subscribe now
Nightmare DX (Developer Experience): Shopify
dx
shopify
web development
This article is the first article in a series about poor developer experience. In this particular article, I am going to write about Shopify and its (un)friendliness for developers.
You don’t need React for building websites
javascript
web development
As I get more experienced, I use fewer libraries and frameworks and rely on good old HTML, CSS, and vanilla JavaScript. I think you should consider doing the same.
The evolution of the design of my site
web design
web development
As any self-respected developer, I redesigned my site many times. I thought it would be fun to document all these designs and see the evolution.
What does “it depends” mean in web development
freelance
remote work
mentoring
I have been in numerous situations where my answer to a client’s question was: “it depends.” But what does that seemingly simple phrase mean in web development? Let’s try to find out.
First Year of UI Dev Newsletter
newsletter
After the first anniversary of the UI Dev Newsletter, I wanted to share how and why I am running it. Read the whole story and get some useful links.
Tools for Auditing CSS
CSS Tricks
publications
css
javascript
Auditing CSS is not a common task in a developer's everyday life, but sometimes you just have to do it. To do it, I usually reach for some of the tools I'll cover in the article.
You want enabling CSS selectors, not disabling ones
css
An enabling selector is what I call selectors that do a job without disabling the particular rule.
How to Get Sticky and Full-Bleed Elements to Play Well Together
CSS Tricks
publications
css
I had a unique requirement the other day: to build a layout with full-bleed elements while one element stays stuck to the top.
The first year of my side project: Code Line Daily
cld
open source
It has been a year since I launched my side project: Code Line Daily. In this post, I wanted to reintroduce the project to the community and talk about the challenges along the way.
My Third Year Of Freelancing
freelance
remote work
The third year of my freelancing career has been successful thanks to honest and open communication, quality time management and support from my family.
I just finished redesigning my site
redesign
serverless
hexo
During the last week, I have been working on redesigning my site. Read all about the changes.
How to create a multi-step form the easy way
DEV
publications
spg
ssg
kwes
A multi-step form is a long-form that is broken into pieces. Learn how I add one to my site.
How to animate SVG signature
svg
css
javascript
Let’s see how to animate SVG Signature with a little bit of JavaScript and CSS. We could use JavaScript function to calculate SVG path length and CSS animation to animate SVG strokes.
2019 Lookback
freelance
remote work
Last year I wrote my first yearly look back, and now it is time for the 2019 lookback.
How I built my second Progressive Web App (PWA)
pwa
As of today, my side project Code Line Daily is available as a Progressive Web App. This post is a sequel to my previous PWA post.
How I built my first Progressive Web App (PWA)
pwa
As of today, my site is available as a Progressive Web App. In this post, you would learn more about how and why I added this exciting feature to my site.
Interview for Remote Working Hub
Remote Work Hub
publications
freelance
remote work
Remote Working Hub is a place where you could find useful information about remote working. I have been asked to share my remote working experiences. I said to myself, why not.
What I learned from my GitHub profile
freelance
remote work
GitHub profile is often recognised as a developer's portfolio. It reveals how often do you contribute, and what kind of projects do you like. Here's what I learned from my GitHub profile.
A Comparison of Static Form Providers
CSS Tricks
publications
serverless
spg
ssg
Static Form Providers do all tasks like validating, storing, sending notifications, and integrating with other APIs. Read the review of the most popular static form providers.
My favorite extensions for web development
productivity
devtools
A web browser is one of the essential tools for web development. Besides default dev tools, there are extensions you could use to make a better web product. I am using Chrome most of the time and these are the extensions I prefer.
Announcing Code Line Daily
css
cld
open source
Last week I released my side project: Code Line Daily. It is a quite straightforward project: a new line of code would be introduced every day. The lines are mostly frontend, PHP, and WordPress code. Here's how I build it!
My favorite Netlify features
CSS Tricks
publications
spg
ssg
netlify
Being a JAMstack developer in 2019 makes me feel like I am living in a wonderland. Yet, there is one particular platform that stands out with its formidable products and features—Netlify.
How to add a contact form to a static website
Codementor
publications
spg
ssg
kwes
With the rise of the static site, developers need a service that could handle forms. Static website contact form is the most common case, and in this article, you would learn how to add one with Kwes form builder.
My second year of freelancing
freelance
remote work
About two year ago, I started with a freelance career. Here is what I have been doing, what did I learn and which problems I stumbled upon.
Oh, the Many Ways to Make Triangular Breadcrumb Ribbons!
CSS Tricks
publications
css
breadcrumb
ribbon
Let’s have a look at how we can create a row of links that sorta run into each other with a chevron-like shape and notch on each block like you might see in a hierarchical breadcrumb navigation.
5 things to consider when creating your CSS style guide
LogRocket
publications
css
styleguide
CSS style guides should be considered an equal citizen of every project requirement. Here are five things that you should keep in mind when working with CSS style guides.
Bookmarks, Saves, Hearts, Stars, Claps
productivity
I realized that I rarely use bookmarks, but I still bookmark interesting sites, projects, or tools.
Custom WordPress Theme Development with SPRO
gulp
starter project
SPRO is a boilerplate of predefined Gulp tasks. The mission is to set up the development environment for your project without writing Gulp tasks again and again. In this article, I am going to show you how to configure SPRO for custom WordPress theme development.
Introducing SPRO
gulp
starter project
SPRO, or Starter Project CLI, is the best starting point for your next project. SPRO aims to set up a perfect development environment by learning about your project architecture and then setting up Gulp tasks for all your needs.
Just My Routine As A Remote Worker
freelance
remote work
As a remote worker, having a routine and self-discipline is critical. Keeping up with multiple clients, personal projects, and continually improving your skills is a challenging task. Here's my recipe on how to stay sane and be a more successful remote worker.
2018 Lookback
freelance
remote work
It is the beginning of the new year, and it is time to look back to 2018, but from a technology perspective. I have learned a lot, here are my findings.
Building an Animated Sticky Header With Custom Offset
css
javascript
With the appearance of the position: sticky property, we could create sticky elements without JavaScript plugins. But creating sticky elements with animations couldn't be achieved without a little bit of JavaScript.
Roadmap, September 2018.
freelance
remote work
I have built this roadmap to remind myself how important is to have a plan for a career. It doesn't matter if I don't fulfill every objective, as long as I am keeping track of the vision.
The essential skill of a developer
freelance
remote work
frontend
Being a developer requires specific skills and tools. I realized what the essential skill for one developer is.
My first year of freelancing
freelance
remote work
About a year ago, I started with a freelance career. This experience has changed me as a professional, but also as a person.
Starter Project - Gulp tasks for CSS
gulp
css
starter project
This article is part of a series about Starter Project, and this time I will explain all about Gulp tasks for CSS.
Starter Project - A set of the latest best practices packed in Gulp tasks
gulp
starter project
This article is the very first article in a series about Starter Project, a set of the latest best practices packed in Gulp tasks. In this article, I am going to explain the idea behind this project, how it could help you on your project and how to use it.
Classily.js - Toggling classes more classily
javascript
plugin
I created a JavaScript plugin for toggling classes more classily, and I called it Classily.js. The plugin is simple yet powerful, and, if used correctly, it could solve tasks that are not so simple.
Fixing Google Analytics caching issue
PageSpeed
optimization
Getting the perfect score from Google PageSpeed Insights could be a tedious task, especially if Google Analytics is present on the website. You end up thinking that 99/100 is the perfect score. My friend, the solution is here.
How to create crooked shadow
css
box-shadow
Recently I was working on a very interesting and challenging project. That was actually the first time I've heard someone says those words and my heart was full of joy. One of the most challenging features to build was to add a shadow on a crooked border.
CSS sidebar toggle
css
sidebar
accessibility
CSS sidebar toggle presented in this post is made with CSS only. These days accessibility is pretty important stuff and, because changing the state of the elements cannot be done without JavaScript, I've added a small snippet for this feature.
Angular dragtable
angular
Angular dragtable is an Angular directive that allows table column reorder.
Recursively includible Angular directive
angular
I've been working on a complex Angular CRUD-ish project recently and one of the requirements was to create a form based on an MVC model. I've created a directive that could generate a form for every complex model.
How to automate development with Atom
atom
We should automate our development process whenever possible. But there are so many tools available and new ones are published every week. Even though these tools help us, it could be very time consuming to learn and to handle all of these tools.
CSS tabs, part II: Accessibility
css
tabs
accessibility
Recently I've been writing about CSS tabs. Topic was surprisingly popular, gaining several thousand users to my page. What was even more surprising were comments about accessibility. I decided to investigate a little bit more and add accessibility to my solution.
How to handle keybindings in Atom
atom
keybindings
In recent articles about Atom, I've talked about different packages that could help us make our daily jobs easier. Many of those packages have different keybindings. But what happens when a keybinding is already used by some other package?
First steps with Github Atom
atom
This is the first article in a series about my perfect Atom setup. First topic is installation and initial setup.