Overview of Popular Static Site Generators

Overview of Popular Static Site Generators

This article was originally published on Toptal Blog.

All static page generators have a single and seemingly straightforward task: to produce a static HTML file and all its assets.

There are many obvious benefits to serving a static HTML file, such as easier caching, faster load times, and a more secure environment overall. Each static page generator produces the HTML output differently.

Read more

The essential skill of a developer

The essential skill of a developer

Being a developer requires specific skills and tools. I have put an effort to make a list of all the skills, tools, and techniques that I acquired during my career, and I was surprised by the number of them. During this process, I realized what the essential skill for one developer is.

Read more

My first year of freelancing

My first year of freelancing

I am writing this article from a frontend developer perspective, as I am one. I have specialized in User Interface, Static Page Generators, WordPress, and page speed optimization.

About a year ago, I started with a freelance career. This experience has changed me as a professional, but also as a person.

Read more

From WordPress to Hexo

From WordPress to Hexo

This article was originally published on Toptal Blog.

Static site generators are systems that compile templates into static HTML pages. If that sounds efficient—yes, it is. There is no server processing or rendering, so static websites tend to be very fast and lightweight, saving you and your users precious time and bandwidth. This increased efficiency is reflected in lower costs and, potentially, higher revenues.

Read more

Fixing Google Analytics caching issue

Fixing Google Analytics caching issue

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. What does that one point mean anyway? And you go to sleep every night knowing that one point is still missing. My friend, the solution is here.

Read more

How to create crooked shadow

How to create crooked shadow

Recently I was working on a very interesting and challenging project. I was told to use CSS wherever possible. 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. I know it doesn’t sound either glamorous or complicated, but it kinda is.

Read more

_bem - Wordpress theme with BEM methodology

_bem - Wordpress theme with BEM methodology

BEM is great. It is simple, yet powerful. If you’re not familiar with it, I highly recommend reading this article by Harry Roberts.

In short, it is a CSS naming convention methodology. It stands for: block, element, modifier. Blocks are parent components, elements are child components and modifiers are different states of components.

Read more

CSS sidebar toggle

CSS sidebar toggle

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.

Read more

Angular dragtable

Angular dragtable

Angular dragtable is an Angular directive that allows table column reorder.

I’ve been searching for a similar solution, including JavaScript libraries, jQuery plugins or Angular directives. I’ve tested various solutions, but nothing worked as expected. So I decided to create brand new directive.

Read more

Recursively includible Angular directive

Recursively includible Angular directive

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. This model was not definite and could vary depending on many parameters in the application. As a result, I’ve created a directive that could generate a form for every complex model. Final code is available on Github repository and it’s called angular-repeater. Demo is available here.

Read more

How to automate development with Atom

How to automate development with 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.

In this post I’ll show you how to automate development process using only Atom packages.

Read more

CSS tabs, part II: Accessibility

CSS tabs, part II: 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. Although my initial idea was to present just a CSS technique for tabs, I decided to investigate a little bit more and add accessibility to my solution.

Read more

Perfect local server with Atom

Perfect local server with Atom

I’ve been using all kind of local server solutions back in a day, from WampServer to Vagrant. I noticed that I had to spend large amount of time on learning and configuration. That was, not only time consuming, but also very frustrating, especially when you’re a newby and you don’t understand half of the instructions and problems.

Read more

Powered by Starter Project.