Check out "Do you speak JavaScript?" - my latest video course on advanced JavaScript.
Language APIs, Popular Concepts, Design Patterns, Advanced Techniques In the Browser

Create your own Covid-19 data tracker

posted in JavaScript on 2020-03-30   covid-19 tracker virus api zeit covid https data github data tracker thevirustracker time johns hopkins university code back end endpoints react created recharts beginning tags tag link countries package sh https c19stats

I'm continuing to experiment with React and TypeScript. The weekend-long project this time was a Covid-19 data tracker. In this blog post I will share how I built c19stats.now.sh. I exposed the data as a public API at the same URL. I guess you, as many other people, follow the situation so you may want to glue your fingers on the keyboard and create something useful around the data. I got lots of fun playing with the diagrams.

read more

Pairify - how to match balanced string pairs

posted in JavaScript on 2020-03-11   pairify balanced matches javascript pairs decided type stack line starter token code const position function category https

I'm now actively working on a VSCode extension. I started it as a theme but then decided to add some more features. Like for example a tin line on the left side of the editor marking the current function scope. In order to do that I had to analyze the current file's code and find the lines that are included in that scope. The obvious approach will be to translate the code to AST and then traverse the tree finding the information that I need. This however will require the usage of a language server which now I don't want to deal with. So I decided to explore a brute force approach. Looping over the string characters and finding balanced matches. I quickly wrapped it into a library. I called it Pairify. It consumes text and returns an array of pairs. This blog post will show you how it works.

read more

VSCode go to definition/implementation fixed

posted in JavaScript on 2020-01-17   vscode typescript intellisense problem implementation working common fixed definition

I just spent ~2 hours on this and I had to blog about it. I bet I will come back to the same problem and it will be nice to have a quick solution at hand. And the problem that I'm talking about is the non working Go to definition or Go to implementation feature of VSCode. Or in other words the JavaScript IntelliSense was not working for me. Of course it was annoying because I had to navigate to files manually via the folder tree on the left or typing the name of the file in the Cmd+Shift+P popup.

read more

Hopa - zero config CLI that runs JavaScript and TypeScript

posted in JavaScript on 2020-01-12   hopa runner typescript javascript babel typescript io webpack https code don t krasimir hopa

Yesterday was one of those days. I stumbled a task and wanted to find the right tool for it. That same task is on my way at least twice a week and I always refuse to optimize it. Because it was a weekend I decided to spend some time and research a proper tool for the job. Well, I find nothing that suites my need. I time-boxed a hour and said F.ck it!. I will code it myself. That's how Hopa was born - a zero config CLI that runs JavaScript and TypeScript. Transpiles, bundles, watches and executes code.

read more

Why and how I built my own alternative of the GitHub's UI

posted in JavaScript on 2019-04-25   igit code github context time api code review roger app

I'm using Git and GitHub in particular a lot. And when I say a lot I really mean all the time. Recently I tracked a week of work and found that 62% of my working time goes into code reviews. Sometimes I'm checking out a branch locally and trying stuff but really most of my time goes into github.com. I spent some time analyzing why the code review process is so time consuming for me. I identified couple of reasons, made a tool and changed some of my habits. In this article I'll show you how I improved my code review speed and lower the time to 38%.

read more

Build your own interactive JavaScript playground

posted in JavaScript on 2018-11-13   code function const console exports editor require file error js

Recently I spent some time working on my own JavaScript playground called Demoit. Something like CodeSandbox, JSBin or Codepen. I already blogged about why I did it but decided to write down some implementation details. Everything happens at runtime in the browser so it is pretty interesting project.

read more

My new and shiny tool for live demos - Demoit

posted in JavaScript on 2018-11-05   demoit resources live coding code demo tool css files tools writing don t

I had some time during the weekend and decided to work on my slides for an event at the end of the month. I reached the part where I have to do a live coding session and I was wondering what tool to use. At the end I created my own called Demoit. This is a short article explaining how it works.

read more

README driven development

posted in Architecture on 2017-09-06   library readme driven development api code writing make documentation started helped

I was doing a podcast episode with Kent C. Dodds when he mentioned README-driven development. And so I decided to try it out with a new library which I just started. Here’s what I found.

read more

Let's write, not generate code. Thoughts about naming stuff.

posted in JavaScript on 2016-07-03   code data html classes naming css good tags

I’m writing code for approximately ten years now and at some point the word “writing” became more important then “code”. I found out that it is easy to generate code but it is difficult to write code. Writing means creating something meaningful. Something that other human beings will read. The code is indeed sent to machines and they do understand ugly code. Not the same for humans though. An important part of our job is to make sure that our code is clear for other teammates.

read more

The return statement is not the end (but it should be)

posted in JavaScript on 2016-01-05   function format return result var defined function dosomething code var format function result var format return result var

Well, I kind of lied in the title of this article. Of course that it is the end of the function. Once we call return everything else after that is simply not executed. Ops … I did it again, I kind of lied again.

read more

Enforce standards while submitting a pull request

posted in JavaScript on 2015-11-29   template textarea javascript bookmarklet n n template var code pull request

GitHub’s pull requests are an important part of my/our development process. That’s why I was thinking about creating a template that will enforce the standards.

read more

Rethinking JavaScript readability

posted in JavaScript on 2015-08-10   function moveforward var code return callwith skipped event bind

You probably know the famous quote that the code should be written for humans to understand and accidentally for computers to execute. Writing code that compiles is easy. Writing readable code is completely different thing. Working in a team is like sharing the kitchen with your roommates. You all should care for the dishes and keep clean. And it is not only because of the others but because of you. You don’t want your dinner in a mixed place and dirty dishes right.

read more

Node.js Blueprints book - second chapter's clarification

posted in Nodejs on 2014-07-30   express version book app chapter node js blueprints var bodyparser code

Before a couple of months my first book Node.js Blueprints was published by Packt. There are a couple of reviews in Amazon about chapter two. It’s about Express. One of the most popular frameworks in the Node.js ecosystem. The book mentions version 3.0 but the truth is that the code samples are for version 4.0. I feel that I still have to point out the differences and mark these parts of the chapter that are not valid for the newest version of the library.

read more

Feeding the beast at 60fps

posted in JavaScript on 2014-07-23   li data browser function var processed code list time

The browsers nowadays are smart. They optimize everything and help us to produce better applications. They process our code as fast as possible and even on mobile devices deliver a pleasant experience. However, at the same time, it is possible to write buggy code and make the browser freezing. We are not talking about slowing down the rendering. We are talking about no rendering at all. There are cases where we want so much from the browser that it just can’t handle it.

read more

Hungry for knowledge - Scotland JS 2014 talks

posted in Must-see on 2014-06-22   javascript neo uk vimeo talk web js ll code build

These are screencasts from the this year's Scotland JS conferences. It happened on 9th and 10th of May. If you are a JavaScript developer you will probably want to see the talks.

read more

JavaScript template engine in just 20 lines

posted in JavaScript on 2013-12-01   var r push match skills code function template index line tpl

I'm still working on my JavaScript based preprocessor - AbsurdJS. It started as a CSS preprocessor, but later it was expanded to CSS/HTML preprocessor. Shortly, it allows JavaScript to CSS/HTML conversion. Of course, because it generates HTML it was normal to act as a template engine. I.e. somehow to fill the markup with data.

read more

To all devs out there

posted in Architecture on 2013-11-26   good code don t project make end css server start things

There are few things which I'm thinking about last few months. I summarize them here. Initially, I started writing this article for the company which I'm working for - East Interactive. The material is not meant to teach. It just contains few thoughts of main and I hope that my colleagues will find it helpful.

read more

PHP: simple captcha script

posted in PHP on 2013-08-08   array code expression alphabet result im

In my company, we have a lot of WordPress sites. Some of them require contact form with captcha field. The short way for solving such task is to use a plugin. However, as you may guess, the add-ons are available for everyone, which means that they could be easily explored and probably hacked. That's why I suggested a simple, custom script, which is developed by us.

read more

CSS: :before and :after pseudo elements in practice

posted in CSS3 on 2013-07-26   content css block text font element width code links height

By definition :before and :after are CSS pseudo elements. You can use them to insert something before or after the content of an element. There are some great articles giving the basics, but I wanted to write down a blog post for the real use cases. Or, at least, to show what I'm using them for.

read more

Chrome Extension: run JavaScript in the context of the current page

posted in JavaScript on 2013-06-14   script code document content run current page tab id code executescript tab id tabs executescript tab

I'm currently working on a Google Chrome extension and I need to run a JavaScript in the context of the current page. The obvious choice for such a logic is the content script. However it is not so easy, because the content script has an access only to the DOM of the current page. It can't run global functions or use global objects.

read more

A strange IOErrorEvent.IO_ERROR event dispatched

posted in ActionScript on 2013-06-11   urlrequest var urlloader addeventlistener json encode obj string http site urlstring string http var urlstring string problem

Really simple GET request from a flex based application. However it fails if GET parameters are passed.

read more

Web Highlights #5

posted in HTML5 on 2013-05-30   http web design article unnecessary paints adobe device google street view code organizing javascript css paint times http www html5rocks

Everyday I'm reading or watching something which I find helpful. Normally I bookmark those things, but at the end I have dozen of folders and subfolders which I never check. So, I decided to make such blog post where I'll share valuable things in the net.

read more

Make the web faster

posted in HTML5 on 2013-03-31   faster browser applications underlying problem tune slow javascript code js profiler chrome tracing ll talk structural profiler pages chrome devtools built build

Slow JavaScript code on your pages? Chrome provides both a sampling, and a structural profiler to help you track down, isolate, and fix the underlying problem. Tune in to learn how to use both profilers, and how to improve your own workflow to build better, faster browser applications! We'll talk about chrome://tracing, the built-in JS profiler in DevTools, and much more.

read more

Chrome Devevelopment Tools could be really helpful

posted in HTML5 on 2013-02-09   detecting memory leaks network performance rendering analyze network performance instrumented development platforms googledevelopers channel strongly recommend ilya grigorik nice screencast build faster javascript code

"Your browser is one of the most and best instrumented development platforms -- you may just not realize it yet. In this episode we'll take a whirlwind tour of how to analyze network performance, rendering and layout pipeline, as well as detecting memory leaks in your Javascript code, and using audits and extensions to build faster and better apps!". A nice screencast by Ilya Grigorik. I strongly recommend the subscription to GoogleDevelopers channel.

read more

Cleaning up <pre> tag content

posted in PHP on 2013-02-02   code newstr pre parts2 code str_replace br parts str code code str_replace br code code

I'm blogging for different technologies, but very often I need to add some code in my articles. This little PHP function helps me to keep the text in my

 tags clean for prettify. It simply removes the 
's and keeps the html tags.

read more

PHP developers - wake up!

posted in PHP on 2013-01-16   code time things framework don t good modules writing people big

PHP is one of the most popular back-end solutions available. However, I think that there is something wrong with the way we are using it. It is really popular to use some giant framework, with a lot of features. Generally, I'm not a big fan of this approach. Even if the framework is well documented and has big community it still adds some restrictions and complexity. Many people are trying to build the perfect framework, which covers as many cases as possible, but the true is that it is not possible. In this article I'll present you my vision about PHP programming and I will be very happy if you share yours.

read more

Creating simple WYSIWYG editor with AS3 (Flex)

posted in ActionScript on 2011-02-11   text str function font html string editor mx var code

There are dozen of JavaScript WYSIWYG editors available, but most of them are too complicated and a little bit buggy. From time to time I'm using my own tool to provide such kind of functionality. It accepts and exports valid html. I decided to share it with you and explain how I built it.

read more

Javascript: handling with crossdomain requests

posted in JavaScript on 2011-01-19   bbb server aaa code data getdata php access bbb

Ajax is a powerful tool for loading new content or data asynchronously. The well known problem is that we can't make requests to other hosts. In other words if your code is located at aaa.com you can't load bbb.com/getData.php. There are several solutions available.

read more

Reported Attack Page in Firefox

posted in Other on 2010-08-17   site code add tools milware click request review check message remove

Before a couple of days the code of my site was injected with some milware script code. In this article I will advice you how to remove this message.

read more