-
The tiniest presentation framework
posted in JavaScript on 2022-03-06 presentation framework html javascript -
I did roughly 50 talks over the years, and for almost all of them, I used Reveal.js. I like it because it's HTML-based. I have complete control of everything and can easily publish the slides online. However, one thing bugs me every single time - the size of my content. I want to use all the available space. This becomes very important when I'm showing code to people. That's why I wrote SimPre. It's a 10KB HTML presentation framework that properly scales and positions my content.
read more
-
Replacing code for production with Babel transformation
posted in JavaScript on 2020-11-29 babel transform plugin production replacement -
If you are building some sort of an app, Babel is probably part of your build system. It is that thing which converts our fancy code to valid, working in a browser, JavaScript. Just recently at work I had to design a solution that swaps a class based on the environment. Or in another words, we have logic that should not reach our users. The file should be available locally and on our staging environment but not in production. A tiny Babel plugin was the cheapest solution for me so I decided to share the result.
read more
-
Transfer MP3 file from Mac OS Catalina to iPhone iOS 14.0
posted in Other on 2020-09-18 mp3 catalina iphone ios14 mac transfer -
I did transfer MP3 files from my mac to my iPhone three times and every time I'm forgetting how it actually works. So I decided to document the process into a blog post.
read more
-
You Really Don't Need All That JavaScript, I Promise by Stuart Langridge
posted in JavaScript on 2020-09-12 javascript performance optimization -
JavaScript is your behavior layer; the way to add interactivity to your sites, to provide a slick and delightful user experience, to make everything fast and easy and clean. But at some point everything changed: the tail started to wag the dog instead and development became JavaScript-first.
read more
-
React: 50 shades of state
posted in JavaScript on 2020-07-21 react state management form components button viewmore compound state component theme onchange application state feature state data client text span const -
We all know that one of the most challenging task in software development is state management. This is especially true for the JavaScript world. There are thousands of articles on this topic and so I decided to write another one 😁. I wanted to share my current thoughts on the different state types. I found that answering "What lives where?" question is far more important than the actual state management. Which more or less is an implementation detail.
read more
-
Recreating Facebook's Recoil library
posted in JavaScript on 2020-07-12 recoil facebook state management mycoil facebook s recoil counter atoms atom component library formattedcountervalue selector key function javascript subscribers hook const return -
This weekend I decided to play with the new kid on the block - Facebook's Recoil library for managing state. I did the trivial counter example to see how it works. It's pretty simple idea so I wondered how much it takes to replicate its features. I found the exact answer - 70 lines of code. Obviously, my implementation didn't cover everything but it was fun so I decided to share my findings.
(A side note: I did not look at the code of Recoil. I didn't want to be bias on how to write my version.)
read more
-
The simplest HTTP proxy with custom headers
posted in Nodejs on 2020-05-06 proxy headers authorization node local request server req http basic pass -
These days I had an interesting problem to solve. At work, on our staging environment, we have basic authorization. It works really well but for some older versions of Chrome we experienced a weird issue. The browser did not pass the authorization header. The app runs fine but as soon as it does a fetch request to a local endpoint the request fails with 401 not-authorized error. In the modern browsers that's not happening because the browser kinda knows that we came here with basic auth and automatically includes
read moreauthorization: basic ...
header.
-
Smart placeholders in your markdown
posted in JavaScript on 2020-05-06 markdown placeholders template annotation marked contentful https button part content stuff p p seemore const -
I ❤️ markdown. I like its simplicity and minimalistic API which is good enough to cover most of needed HTML markup. At least for textual content. At work we have a small node based microservice that delivers data from Contentful in exactly markdown format. It's all working well but we started having cases where part of the text is in Contentful and the other part is in that microservice. For example when we have a button with a catchy design. We want to content manage the label of the button but the actual markup to be on our side.
read more
-
NADCAST.24 с Радо Станков
posted in NADCAST on 2020-03-26 nadcast remote productivity work tips home working remotely separation https rstankov biz 24_radostankov mp3 cbox biz 24_radostankov host003 cbox biz ws host003 cbox outset ws host003 nadcast outset ws http nadcast outset mp3 http nadcast -
В тези смутни времена се чуваме online с Радо Станков за да си поговорим за remote working. Не че по принцип не се чуваме така, но сега е малко по-различно. В този 24-ти епизод споделяме нашия опит в работа от разстояние. Приятно слушане.
read more
-
My top 3 tips for working remotely
posted in Other on 2020-03-20 remote home work tips productivity working remotely separation working -
These days working from home is a norm. We all know why. This f.cking virus is all over the globe. I bet there are tons of articles on how to work remotely efficiently but I wanted to give my two cents.
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
-
From 0 to 100 GitHub stars in a week
posted in JavaScript on 2020-02-27 github stars project branding promote octomments krasimir write idea https github blog align center don t easy section add https post link javascript reddit facebook make time -
2020 for me started with the release of several OS projects. Two of them reached 100 stars in a week and I was thinking that would be nice sharing my workflow. Not like it is working every time, absolutely not, but leads to some good results.
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
read moreGo to definition
orGo 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.
-
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
-
Part 1: We need channels! A gentle introduction to communicating sequential processes.
posted in Riew on 2020-01-06 riew csp routine go javascript channels put javascript fibonacci index function return pattern fibonacci number -
CSP is a formal language for describing patterns of interaction in concurrent systems. It's used in Go, Crystal, Clojure's core.async and a couple of other places. The idea in its core is nothing so complicated but it offers some interesting capabilities. Surprisingly enough it is not really popular in JavaScript. Recently I'm exploring this pattern and here are my findings.
read more
-
Part 2: Riew - reactive view basics
posted in Riew on 2020-01-06 riew csp routine go javascript channels channels channel const javascript function ch view console log -
Riew is a library based on communicating sequential processes (CSP). It is made to help with communication and synchronization between your view and business logic. It's distributed as a npm package, it has 0 dependencies and adds ~8KBs (gzip) to your application on production.
read more
-
Part 3: Riew - reactive view in patterns
posted in Riew on 2020-01-06 riew csp routine go javascript channels console log yield krasimir riew https github function state const -
In this article we will see some use cases of Riew. Those are patterns which I found repeating while using the library. There are other blog posts part of the same series and I will suggest checking at least this one so you get a basic understanding before jumping into the code snippets below.
read more
-
Reactive view - the concept
posted in Riew on 2020-01-04 riew csp routine go javascript channels kitty ch const function view https react redux -
Something bugs me last couple of years. I'm using React for some time now and there is always this doubt if I'm placing the business logic on the right place. I'm trying to be pragmatic, to follow best practices and listen what the community is saying. However, I still feel that something is not ok. This blog post presents the idea of the reactive view. That is nothing new per se but I came up with this term because it fits well in my idea.
read more
-
Bret Victor: Inventing on principle
posted in Inspiration on 2020-01-01 inspiration inventing principle href https vimeo bret victor inventing decade -
I just finished reading My Decade in Review by Dan Abramov and as part of his article he mentions this talk by Bret Victor. I think it's amazing and want to keep a reference to it somewhere. What a better place than this 12 years old blog.
read more
-
Rethinking the Redux API
posted in JavaScript on 2019-09-10 redux const state login username password authenticated action function reducer -
I really like Redux. I Love its ideas. The reducers for example - small pure functions that apply changes without side effects are nice way to model the mutations in the state. Redux also teaches us to use the one-direction data flow which makes our apps more predictable and stable. These two things fits well for what we are doing on the front-end - building user interfaces.
Of course there is nothing perfect and Redux as every other library has its own problems. In this article I want to explore some ideas for new APIs that will help solving the problems that I encounter. I’ll be happy to see your comments below.
read more
-
Jolly Roger - a 2KB micro-framework based on React hooks API
posted in JavaScript on 2019-04-20 time roger const state return function usestate yohoho action -
The hooks API is a wonderful idea. There are some slick patterns involved that push the React development to a more functional approach. I'm interested in trying that new API and decided to use it for my latest project. However, after a couple of days, it looked like I can't build my app only with hooks. I needed something else. And that's mainly because each hook works on a local component level. I can't really transfer state or exchange reducers between the components. That's why I created Jolly Roger. It has similar helpers but works on a global app level.
read more
-
forEach or not to forEach
posted in JavaScript on 2019-04-12 array foreach item component update react iteration position remove state -
I had an interesting bug in my React application. It happened that the problem was in the fact that I was using
forEach
instead offor
.The bug that I was encounter was
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
-
React hooks: changing the mindset
posted in JavaScript on 2018-10-31 react function hooks count counter return useeffect state const usestate -
If you use React you probably know about the so called hooks. They were officially announced at this year's ReactConf by Sophie Alpert and Dan Abramov. Their presentation could be seen here. I, same as many others got intrigued by this new feature. A little bit confused by if I like them or not but kind of excited. This article pretty much sums up my thinkings around React hooks and aims to give a balanced opinion.
read more
-
React and separation of concerns
posted in JavaScript on 2018-05-27 loading users return error component react function data app css -
Years ago when Facebook announced their JSX syntax we had a wave of comments how this was against some of the well established good practices. The main point of most people was that it violates the separation of concerns. They said that React and its JSX are mixing HTML, CSS and JavaScript which were suppose to be separated.
In this article we will see how React and its ecosystem has quite good separation of concerns. We will prove that markup, styles and logic may live in the same JavaScript land and still be separated.
read more
-
Implementing an async queue in 23 lines of code
posted in JavaScript on 2018-05-07 tasks taskindex getnexttask numofworkers function result promise task array process error run -
Recently we had an interesting task at work. The user makes a selection of items and clicks a button. Then for every selected item we have to make a request to our API. The thing is that the user may click as many items as he/she wants. In order to speed up the process we decided to handle four requests in parallel and once some of them is finished we pull the next one. If you ask why exactly four requests in parallel read this paper.
read more
-
My take on Redux architecture
posted in JavaScript on 2018-04-06 state action redux const visible store function return counter type -
Redux is a library that acts as a state container and helps managing your application data flow. It was introduced back in 2015 at ReactEurope conference (video) by Dan Abramov. It is similar to Flux architecture and has a lot in common with it. In this section we will create a small counter app using Redux alongside React.
read more
-
NADCAST.11 с Мариан Игнев и Павел Иванов
posted in NADCAST on 2018-02-23 http sashido io nadcast -
Първия епизод за 2018 е с Мариан и Павел. Поговорихме си за Sashido.io, инфраструктури, наемане на хора и още нещо :)
read more
-
Markup as function
posted in JavaScript on 2017-12-01 ischristmas user state function children component props greeting redux userdataprovider jsx -
If you are writing React applications you probably know about higher order components or render props (which by the way I think is kind of a form of higher order component pattern). In both cases we have a component that encapsulates logic and passes props down to children. Recently at work we came to the idea that we may push this further and represent some functionalities which are out of React in the same fashion - with a single tag in our components tree.
read more
-
Meet the JavaScript pattern of the year or how to handle async like a boss
posted in JavaScript on 2017-11-24 generator player function result return position error const console log yield call player -
Sometimes when you learn something new you get really excited. Excited to that level so you want to teach it to someone. That is the case with the concept which I found a couple of months ago. It is an implementation of the command pattern using generators. Or the well known saga used in the redux-saga library. In this article we will see how the idea makes our asynchronous code simpler and easy to read. We will also implement it ourself using generators.
read more
-
Post-transpilation or what is the real face of your code
posted in JavaScript on 2017-10-10 function user return firstname lastname var person object constructor greeting -
If you write JavaScript today you probably use some sort of a transpilation tool. A tool that reads your hipster code and convert it to code that works in the browser. In this article we are going to see what is actually send to the browser and how exactly libraries like Babel polyfill some of the ES6 features.
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
-
The powerful higher-order component pattern
posted in JavaScript on 2017-06-10 component function props react const job dependencies h1 return state -
There are lots of things which I like in React. Mostly the fact that it teaches interesting patterns. One of my favorites ones is higher-order component. In this article we’ll do a couple of experiments and will see how powerful this approach could be.
read more
-
Children in JSX
posted in JavaScript on 2017-01-06 todo header component return props children function todos classname todolist title -
(This article is part of React in patterns series.)
React is highly composable. And the API that enables that is
read moreprops.children
. It gives us the power to create a placeholder that is later filled with content from the outside.
-
The bare minimum to work with React
posted in JavaScript on 2016-06-13 react app function file babelrc return babelify browserify render superclass -
The setup here is available at GitHub here.
Half an year ago I published A modern React starter pack based on webpack. The starter provides the basic tooling around React. However, I noticed that very often I need even less stuff than that. That’s usually when I want to hack something quickly. In this blog post we’ll see what’s the bare minimum to work with React.
read more
-
Thoughts on semantic versioning, npm and JavaScript ecosystem as a whole
posted in JavaScript on 2016-05-11 browserify npm dependencies version package release don t versions features -
If you are front-end developer dealing with single page applications you probably know that JavaScript ecosystem is not perfect at all. A few things may go wrong and break your build. In this article I’ll go through those features. Features which are, by my humble opinion, problematic.
read more
-
Lazy-load your images with Coloor
posted in JavaScript on 2016-04-03 image src coloor img var images base64 canvas size function -
Last week I landed on an article by Manuel Wieser called Dominant Colors for Lazy-Loading Images and I found the topic really interesting. It’s about lazy-loading of images. Something that Medium is using.
read more
-
Debugging with Node
posted in Nodejs on 2016-03-22 debugger step node text function program line run counter command -
Node has a wonderful debugger. As a front-end developer I’m mainly using Chrome’s tools but sometimes I run things in Node environment and this native feature comes handy. In this article we’ll see how to debug in the terminal using Node’s debugger.
read more
-
Constructive destructuring
posted in JavaScript on 2016-02-24 var destructuring function object data enabled files options attachments -
Destructuring is one of my favorite ES6(ES2015) features. It just shortens my code and helps me be more explicit with my statements. Let’s see it in action.
read more
-
Meet sequence expression
posted in JavaScript on 2016-02-02 var item b returns sequence expression true return skipif result loop -
You have no idea how fun is to transpiler JavaScript. I’m digging into that last few weeks and there is a step where I have to transform an AST into valid code. There is one tree node which I really like - sequence expression.
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
read morereturn
everything else after that is simply not executed. Ops … I did it again, I kind of lied again.
-
Start your own JavaScript library using webpack and ES6
posted in JavaScript on 2015-12-30 library js webpack babel true var file module exports eslint function build -
Two months ago I published a starter pack for React based on webpack. Today I found out that I need almost the same thing but without the React bit. This simplifies the setup but there are still some tricky parts. So, I made a brand new repository webpack-library-starter and placed all the stuff that we need for creating a JavaScript library.
read more
-
Dissection of Flux architecture or how to write your own
posted in JavaScript on 2015-12-18 store function action var return consumer change dispatcher view -
The Flux implementation discussed in this article is available here github.com/krasimir/fluxiny. Feel free to use it in a browser directly or as a npm dependency.
I’m obsessed by making my code simpler. I didn’t say smaller because having less code doesn’t mean that is simple and easy to work with. I believe that big part of the problems in the software industry come from the unnecessary complexity. Complexity which is a result of our own abstractions. You know, we (the programmers) like to abstract. We like placing things in black boxes and hope that these boxes work together.
read more
-
A story about currying
posted in JavaScript on 2015-12-15 var function read dict key return currying button bind big dictionaryb blue -
I hope you know about currying. If not then please read this book. It’s basically a process of calling a function with less parameters than it expects. Ok, not exactly calling the function but prepare another function that will run the original one. Some people call the returned function higher-order factory function. Really powerful concept.
read more
-
CSSSteal - Chrome extension that extracts CSS
posted in CSS3 on 2015-09-17 css styles var section el small li element rules -
We had to update some of our old pages adding new elements. This means mixing old and new code. Placing HTML markup and JavaScript in legacy pages is not that difficult. Yes, it brings some issues but they are easily solvable. However, the CSS is a whole new story. That’s why I did CSSSteal. It helps me extract the needed styles.
read more
-
How require/import may decrease your testability
posted in JavaScript on 2015-08-23 login http js function var module password username login js user promise -
When CommonJS was announced we all thought “Finally something that will organize our code”. However, there are some cons that we should be aware of. It’s not only unicorns and rainbows. In this article we will see how a simple
read morerequire
line makes our code difficult to test.
-
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
-
Hacking Browserify
posted in JavaScript on 2015-07-04 function require user var return -
You’ve probably heard of Browserify. It’s a nice npm module for bundling your JavaScript for a client-side usage. It lets you use similar to Node.js modular system but for the code running in the browser. I had few issues testing modules in an app that uses Browserify. So I had to learn how it works and probably hack it in order to solve my problem.
read more
-
Using Local Storage as a communication channel
posted in JavaScript on 2015-05-05 namespace data localstorage function var storage loop browser buffer namespace -
So it's been a few months since I published something here. It’s not because I’m lazy (that’s true though) but because I was working on my second book. Now the book is almost finished and I’ll start actively blogging again. In this article we’ll see how to use the local storage of the browser as a communication channel.
read more
-
Unit test your client-side JavaScript
posted in JavaScript on 2014-11-20 var register test function message password username js directive jsdom angularjs -
I don’t think that we have to discuss the importance of having tests. That’s not something that we add to the project in addition. That’s something that the project is based on. And because testing is so important we have bunch of tools in our disposal. We all know (I hope) how to test our back-end code. However, once we move to the front-end is a bit different. At the moment we are working on a big single page application and testing is one of our main focuses. In this article you will see how to unit test our client-side JavaScript.
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
-
ToDoMVC with AbsurdJS
posted in JavaScript on 2014-07-26 model function js todos app main css component absurdjs event -
You've probably heard about ToDoMVC project. It's same ToDo application made with different frameworks. It's interesting how the same problem is solved by different programmers following different concepts. This article is about making the ToDoMVC application with AbsurdJS.
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
-
Usersnap - the holy grail of bug reporting
posted in Must-see on 2014-07-15 usersnap data xmlhttp json function script project client s page -
The bug reporting is something very important for us. As developers, we produce code that should work everywhere. Not only on our machines. No matter how many times we test our application it often happens that it does not work properly for the client. We all know how helpful is an email with text “It does not work. Fix it ASAP!”. Usersnap is amazing tool that removes the gap between you (the developer) and the non-techy guy from the other side.
read more
-
Node.js application made with Express and AbsurdJS
posted in Nodejs on 2014-06-07 html js function css express content styles absurdjs app -
Node.js is one of those new technologies, which are attracting more and more developers every day. Mainly, because it's JavaScript driven, a lot of people are interested working with it. In this tutorial, I'll show you how to use AbsurdJS together with Express. Express is one of the popular Node.js frameworks. However, the other instrument is really fresh one and I hope that you will find it useful.
read more
-
Sorry, Chrome killed the terminal
posted in Nodejs on 2014-06-04 yez extension browser terminal node js chrome shell commands running task -
That's right. I'm not using the terminal anymore. Instead of that I'm using Chrome. Yes, the Google's browser. There is an extension called Yez! that connects to a Node.js module via web socket. It executes the shell commands and returns the result. And even works under Windows.
read more
-
Node.js: managing child processes
posted in Nodejs on 2014-05-21 error stdout js exec console log stderr visits function var module -
These days I spent some time working on Yez!. Chrome extension whose main role is to replace the annoying switching between the terminal and the browser. It uses Node.js module to run shell commands. So, I had to deal with child processes, and I decided to document my experience.
read more
-
Codefront.io is around the corner
posted in Must-see on 2014-04-25 developer open io front end css javascript talk speakers interesting conference linz -
There are only two weeks left before the international front-end conference in Linz - Codefront.io. It's organized by the guys from WebBox and it's scheduled for 10th of May. You still have a chance to buy a ticket and listen interesting talks about our lovely Web.
read more
-
Look ma, JavaScript only Off-Canvas menu
posted in JavaScript on 2014-03-25 menu content css links function html position absurdjs isopen -
The off-canvas menu is pretty popular nowadays. You know, the little button in the right upper corner which opens the navigation with a slide-in effect. That's what we are going to build in this article. The interesting things is that we are not going to use CSS neither HTML, only JavaScript.
read more
-
JavaScript: bind function
posted in JavaScript on 2014-03-09 function bind prototype comments fullname var scope user call arguments -
The this keyword is always important in JavaScript. I'll admit that it took me some time to actually understand how it works. You know, sometimes JavaScript is all about the scope. Where you are and what you have an access to. This article is about the bind function. Something which I use very often.
read more
-
Using media queries in JavaScript (AbsurdJS edition)
posted in JavaScript on 2014-03-04 media css function var width window matchmedia dom html mq absurdjs -
If you believe in responsive design you probably use a lot of media queries. That's a CSS feature which gives us the power to add something like if statements. We are able to apply rules only if the current page meets certain conditions. In this article I'll show you how I use media queries in JavaScript.
read more
-
Mastering the DOM access
posted in JavaScript on 2014-02-28 el parent var dom api return selector function val element -
If you build web applications you probably communicate with the DOM a lot. Accessing and manipulating DOM elements is the thing which we do almost every day. Very often we collect information from different controls, we need to set values, change the content of div or span tags. Of course there are million libraries which handle these actions. The most popular jQuery, is de factor a standard. However, sometimes you need something smaller. In this article we will build our own class for managing DOM elements.
read more
-
Cross-browser handling of Ajax requests
posted in JavaScript on 2014-02-23 ops xhr function data request var headers return callback ops method -
This blog post is part of series about AbsurdJS. I'll continue filling the library with small and self organized black boxes. In the last article we talked about creating a JavaScript router. This time we will go through the process of making Ajax requests.
read more
-
Dependency injection in JavaScript
posted in JavaScript on 2014-01-06 function var dependencies router service scope arguments deps dosomething -
I like the quote that the programming is all about managing complexity. Maybe you've heard that the computer world is a giant construction of abstractions. We simply wrap things and produce new tools over and over again. Just think for a minute. The languages which you use have build-in functionalities and they are probably abstracted functions of other low level operations. It's the same with JavaScript.
read more
-
7 lines JavaScript library for calling asynchronous functions
posted in JavaScript on 2013-12-12 function var funcs callback scope queue function funcs var queue function array -
I was surprised by the good feedback for JavaScript template engine in just 20 lines and decided to blog for another small utility function which I'm using often. While we are talking about JavaScript in the browser, most of the operations are asynchronous. We are dealing with callbacks all the time and sometimes we end up with awesome callback hell.
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
-
AbsurdJS fundamentals
posted in JavaScript on 2013-11-11 css api color styles var function absurd absurdjs javascript -
AbsurdJS became one of my favorite projects. I spent a good amount of time developing it and it's getting more and more interesting. I also received some positive feedback, so I think it is time to write a bit more about the module and explain how it actually works and what exactly is made for.
read more
-
JavaScript: dependency free extend method
posted in JavaScript on 2013-10-28 extend var function o prop destination tobedefined expect o address bla bla -
While I worked on AbsurdJS I needed a function which accepts numerous objects and combines their properties. I.e. something like the _.extend method of UnderscoreJS. What I did is actually to use one more dependency just because of such method. John-David Dalton nicely pointed out my mistake and added a simple function which solved the problem. I change it a bit and now it acts as UnderscoreJS's version.
read more
-
JavaScript challenge: queue implementation
posted in JavaScript on 2013-09-24 function queue item var api queueelements flags delay return api queue function -
I'm currently working on an animation-heavy web application. There are long chains of CSS transitions/animations, which I have to do. I wrote this little library, because I needed something lightweight with minimalistic API. I think that it deserves its own repository and I created one.
read more
-
Auxilio Chrome extension or how I boost my productivity
posted in Must-see on 2013-09-04 auxilio function command callback browser current extension page github -
I'll be honest and I'll say that I'm a bit lazy sometimes. I'm one of those developers which don't like to repeat same actions again and again. There are dozen of things which I have to do while working on a project. Very often I'm covering the development of several applications and have to switch between them. It's really annoying process. I hate to have many opened tabs in my browser, many consoles or several code editors. I always try to improve my productivity by automating tasks. I think that even switching between opened applications takes too much time.
read more
-
JavaScript: creating class based on object
posted in JavaScript on 2013-08-31 object function var return ob2 ob1 create obj return function function obj return -
I'm very happy visiting Stackoverflow more often then Facebook these days. Today I landed on this question. I'm not sure that I understand the real context of the situation, but I found something helpful, which may be useful for you. What if we have an object and want to use it as a base for JavaScript class (i.e. function). The idea is to create instances and basically extend the original object.
read more
-
SASS: interpolation in a name of variable
posted in CSS3 on 2013-08-29 bg background color interpolation header include set variable sass set styles dark include set styles arg header include bg arg header -
I just answered on that question at StackOverflow. That's actually asked a lot last few months.
read more
-
The power of inherit or how to animate pseudo elements
posted in CSS3 on 2013-08-27 box inherit pseudo background position 15px left div doesn t top move text -
Luckily, I have time to watch screencasts from various conferences. Last few weeks I'm watching videos from Fronteers2012. They are all great and it worths checking out. However, there is something which I found really interesting. It's about animating pseudo elements.
read more
-
Managing events in JavaScript
posted in JavaScript on 2013-08-23 model function var view controller eventbus callback function var scope event -
I just noticed that the most popular repository in my GitHub account is EventBus. There is already an article about it, but it's a little bit outdated. I needed to clarify few things, so here is a new one.
read more
-
Managing events in JavaScript
posted in Must-see on 2013-08-23 model function var view controller eventbus callback function var scope event -
I just noticed that the most popular repository in my GitHub account is EventBus. There is already an article about it, but it's a little bit outdated. I needed to clarify few things, so here is a new one.
read more
-
Send message from web page to chrome extension\'s background script
posted in JavaScript on 2013-08-22 script event web page document function message content script background script send -
I just answer on that question in StackOverflow. I think that this is a common quetion so it worths writing about it.
read more
-
A bad side effect of the aspect oriented programming
posted in JavaScript on 2013-08-15 thing result function thing prototype dosomething start prototype dosomething function aspect oriented programming problem original class -
I just read this very interesting article published on know.cujojs.com. It's about aspect oriented programming. At the beginning I thought "Oh, that's kinda cool", but when I start thinking about how I'll use it in practice I notice something bad. The blog post itself is well written and informative, but doesn't include any cons of the used technique.
read more
-
Two handy and advanced SASS features and their limitations
posted in CSS3 on 2013-08-13 mixin margin item reset list include extend sass items interpolation -
I really like SASS and I use it a lot in my daily job. There are tons of useful features. However there are some things which I want to do, but I can't. There are limitation in the syntax and missing functionalities. Sharing what I found, I want to know if you meet those limitation and how you get around them.
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
-
SASS: @content directive is a wonderful thing
posted in CSS3 on 2013-08-06 button font size 20px color mixin content border font size 30px 20px text decoration size 20px text block font size display block font -
I just started using SASS and I love it. A bunch of cool features, which will help me to improve my CSS coding. @content directive is one of them.
read more
-
Introduction to animations in HTML
posted in HTML5 on 2013-07-30 animation var animations css function element class add -
Last few years designers use a lot of animations directly in the HTML. That's of course kinda cool, because you don't need a plugin in order to see their work. There are several ways to make animations in HTML. It's an interesting subject and I decided to make a short research and summarize the information.
read more
-
Auxilio Chrome extension - common use cases
posted in JavaScript on 2013-07-25 extension -
Last months I'm actively working on an extension for my favorite browser - Google Chrome. Here are few videos showing some of its functionalities.
read more
-
JavaScript is cool
posted in JavaScript on 2013-07-23 var function class return instance pubmethod module event function return -
I'm writing a lot of JavaScript these days. Sometimes it's really crazy what you can do with that language. I have bunch of tools in my arsenal and I wanted to document them somehow. Writing an article is a good option. By tools I mean patterns, piece of logic or just syntax shortcuts. However, this article is not exactly about design patterns, but it uses some of them. It's just about few ideas, which I came into during my daily scripting.
read more
-
JavaScript: sequencing function calls #2
posted in JavaScript on 2013-07-10 chain error console log arguments function res chain errors run object chainends -
I created a simple JavaScript library for running functions in a sequence. The story behind this is published here. Today I made few interesting changes which deserve a new blog post.
read more
-
JavaScript: sequencing function calls
posted in JavaScript on 2013-07-09 function var callback run element chain function res type console log -
While I'm working on Auxilio I end up in a sitatuation where I have to call few javascript functions in a sequence. It's an interesting how this could be solved and I'll be happy if you share your opinion for such problem.
read more
-
Extending Jasmine (BDD framework for testing)
posted in JavaScript on 2013-07-05 function jasmine htmlreporter spec reporter jasmineenv test prototype -
Don't get me wrong, Jasmine is a wonderful framework. I'm using it for testing JavaScript in both places - front-end (in browser) and back-end (Nodejs). However, the client side has some disadvantages, which I just fixed. I hope that someday these changes will be moved to the official version (or at least I'll make a pull request very soon).
read more
-
Auxilio Chrome extension presentation at VarnaLab
posted in HTML5 on 2013-06-27 extension chrome github -
Last month I'm working on my own extension for Chrome. It adds two things - a much simpler new tab page and fully working interactive console. The command prompt is actually added in the DevTools panel.
read more
-
Security sandbox violation error even with crossdomain.xml
posted in ActionScript on 2013-06-26 http file security sandbox violation -
Again, a very nice surprise by Adobe. I have a flex application which makes cross-domain requests to another server holding REST API. There is a crossdomain.xml file, but the request still doesn't work.
read more
-
Deploying ExpressionEngine based site
posted in PHP on 2013-06-25 php file database config files dblogger sql local operations define -
I found ExpressionEngine framework very good. It brings the flexibility which I need and still has a good amount of features. However, as many other similar tools, the deployment could be a little bit difficult.
read more
-
Insert css or javascript dynamically
posted in JavaScript on 2013-06-18 var function css files -
That's a super simple function for adding new css or javascript files in the current document. I didn't test it in all the browsers, because I'm using it in the chrome extension and I need only Chrome supported.
read more
-
Chrome extension: debugging dev tools tab or how to make console.log
posted in JavaScript on 2013-06-18 chrome dev tools obj message alert chrome runtime console log bglog function work -
It's really interesting to work on an extension for Chrome. However, sometimes it's a little bit difficult to debug. Especially when you work on a dev tools add-on (i.e. a new tab).
read more
-
Javascript string replace and regular expression
posted in JavaScript on 2013-06-15 word git replace string innerhtml text replace element innerhtml text changetext function word creator linus torvalds linux creator linus source project started -
The replace method in JavaScript is pretty much the same as in the other languages. Replace part/s of a string with something else. However, there are some tricky moments and I wanted to write this article, because I met this problem several times in the past. Actually, very often I use my blog as a documentation for myself and this is one of those cases. Probably I'll be in the same situation after week or so and I'll just check here for the proper solution.
read more
-
Simple command line parser in JavaScript
posted in JavaScript on 2013-06-11 long parameter param3 var parse command param1 commandparser parse command param3 commandparser parse param1 param2 param3 command param1 param2 param3 command param1 string function -
There should be some super cool RegEx, which I can use. However after short research I wasn't able to find it. So, I created a simple function which does the job.
read more
-
The Flash Builder debugger failed to connect to the running application.
posted in ActionScript on 2013-06-07 browser debug application flash player run device project time bin debug folder flash builder debugger -
I really don't like FlashBuilder. Mainly because I'm losing a lot of time just to setup the project. Usually when I receive the files I need around 10 hours just to compile successfully. The reasons for those problems are different Flex SDK, different directories' tree, wrong paths, missing libraries or fonts. Today I encounter a brand new type of problem.
read more
-
Git under windows (console mode)
posted in Architecture on 2013-05-29 git windows powershell file aliases function command status alias set -
I'm a Windows user. I also have a virtual machine with Ubuntu installed and coding there from time to time. I use Git a lot and in general I prefer console mode over the GUI. Under Unix everything works just great, but Windows's command prompt requires more efforts from our side. However I found some helpful tips, which could make your life easier.
read more
-
Responsive Design Workflow (my talk at VarnaLab)
posted in HTML5 on 2013-05-23 varnalab presentation s slides talks -
Presentation's slides. All my talks at VarnaLab are available here.
read more
-
A short review of ExpressionEngine framework
posted in PHP on 2013-05-20 short review expressionengine framework s capabilities tech pro account article made project start -
I'm going to start a new project with ExpressionEngine. So, I made a short review of the framework's capabilities. The article is available at my account in tech.pro.
read more
-
Web Highlights #4
posted in HTML5 on 2013-05-15 http performance media queries behavioral breakpoints tools google css transitions great optimize things -
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
-
CSS: transition from pixels to auto
posted in CSS3 on 2013-05-14 height css problem set content column animation slided auto -
As you may know I just updated my web site. There are five columns which nicely slide up and down on a lower resolution. In other words, accordion-like navigation. Initially I made this effect with JavaScript. But there was a bug and I decided to use pure CSS. I wanted to define everything in CSS classes which to add or remove. The idea wasn't bad except the fact that every column contains dynamic content and I wasn't able to set the exact height when the column is slided down.
read more
-
Real time game with NodeJS and Socket.io
posted in Nodejs on 2013-05-13 user var function users socket io game data end clicks currentwidth -
NodeJS gives me the ability to write back-end code in one of my favorite languages - JavaScript. It's the perfect technology for real time applications. In this tutorial I'll show you how to build a web chat with Socket.io.
read more
-
Web Highlights #3
posted in HTML5 on 2013-04-22 http answer http www html5rocks css paint times design workflow considerations web design workflow responsive web design -
A bunch of cool stuff ;-)
read more
-
Web Highlights #2
posted in HTML5 on 2013-04-10 media queries css regions chrome web app ui adaptive web app asset downloading results query asset downloading media query asset understanding typographic hierarchy browser -
Some of the cool and helpful things which I found 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
-
What exactly "Retina display" means in the context of the front-end development
posted in HTML5 on 2013-03-26 retina display means simple explanation great article ll suggest lot searched smashingmagazine check -
If you are wonder what exactly "Retina display" means I'll suggest to check this great article in SmashingMagazine. I searched a lot for a simple explanation and that's the best one.
read more
-
Catch uncaught Exception in Node.JS
posted in Nodejs on 2013-03-15 exception console log run -
I'm working on a very simple tool which compiles some stuff. The big problem is that if I write something wrong I can't catch the exception from the compiler and the nodejs's process exists. Then I have to go back to the console and run the app again. That's of course not acceptable. Thankfully there is a workaround.
read more
-
Compiling iOS application under Windows with Flex SDK
posted in ActionScript on 2013-03-06 file developer application step openssl certificate device app p12 ios -
As you may know, Apple doesn't allow creation of iOS applications just like that. Especially under Windows. It's somehow a complex process, which requires several steps in a specific order. However it is still possible and you can do that without Mac.
read more
-
Web assets - tips for better organization and performance (discussion at VarnaLab)
posted in HTML5 on 2013-02-28 web assets tips varnalab discussion performance organization subject web assets slides screencast -
A screencast of the discussion at VarnaLab on subject "Web assets - tips for better organization and performance". The slides are available here.
read more
-
Douglas Crockford’s Function Challenges
posted in JavaScript on 2013-02-25 function s function challenges crockford s function douglas crockford s called multiple times function challenges test compose functions function scope learn knowledge -
Douglas Crockford’s Function Challenges. Test your knowledge of function scope and and learn to compose functions that can be called multiple times through function returns.
read more
-
Competition for developers and game enthusiasts with cash prizes
posted in Other on 2013-02-13 game activation engine developers competition prize game extension february mission playing gaming -
AE Ventures (part of Alkuvoima East Group) is developing a game engine called Activation Engine for real life gaming, where gaming missions become part of everyday activities. These games can be created by anyone and are geared towards learning and casual entertainment.
read more
-
Discussion about PHP at VarnaLab
posted in PHP on 2012-11-22 varnalab php discussion -
A screen capture of the discussion about PHP at VarnaLab.
read more
-
Testing with headless browser (Zombie.js + Jasmine)
posted in Nodejs on 2012-10-14 browser function login site expect browser test testing input zombie css selectors -
I was planning to post this article a few weeks ago, but today I finally finished the examples and I can't wait to share it. We all know that the testing is a big part of our daily tasks and we should use every existing tool to make our lives easier. I really like test driven development and once I found the concept of the headless browsing I started to think that we can automate every single aspect of the testing. In this post I'll show you how to use Nodejs to test a simple php site.
read more
-
Discussion about Photoshop at VarnaLab
posted in Design on 2012-09-05 varnalab photoshop discussion -
A screen capture of the discussion about Photoshop at VarnaLab.
read more
-
The Principles of Agile Development
posted in Architecture on 2012-07-10 agile development principles http net tutsplus sides http net fun developing software agile development agile articles general communication easy business people constructive -
Agile or Agile Development – we hear these words more often these days. But do we really know what it is all about? How can it help us become more effective, while having lots of fun developing software? How can we use it to communicate with business people and make this communication easy and constructive for both sides?http://net.tutsplus.com/articles/general/the-principles-of-agile-development/
read more
-
What is JavaScript prototype by Angus Croll
posted in JavaScript on 2012-06-30 javascript prototype understanding javascript prototypes http javascriptweblog wordpress language http javascriptweblog javascript language http context explanations -
Maybe one of the best explanations of the prototype in the context of JavaScript language.http://javascriptweblog.wordpress.com/2010/06/07/understanding-javascript-prototypes/
read more
-
Why we should think about our CSS
posted in Architecture on 2012-06-05 css browsers block rendering tv device ratio print tv device g print tv e g print browsers download css page browsers download white page browsers experience white page -
_The evil that CSS do:- Browsers block rendering until all CSS arrives. With the worst possible experience: white page.- Browsers download CSS they don't need, e.g. print, tv, device-ratio... And most browsers block rendering because of these too- Sometimes CSS blocks the other downloads too (not just block rendering, but block images and scripts that follow) - when followed by an inline SCRIPT or when it's a CSS in conditional comment for IE_Read the full artcile by Stoyan Stefanov here.
read more
-
Brian McCallister and the code
posted in Architecture on 2012-05-16 programming profession convert business requirements efficiently convert business full article bugs read repeatable manner things programming computer -
_Programming and the Profession of Programming are quite different things. Programming is being able to efficiently tell a computer exactly what to do in a repeatable manner. The profession of programming is being able to efficiently convert business requirements into bugs._Read the full article here.
read more
-
Dependency Injection in PHP. Create your own DI container.
posted in PHP on 2012-05-12 class key view show arguments array content navigation title skills -
By my opinion one of the biggest problems in programming are dependencies. If you want to have a good well written application you should avoid dependencies between your modules/classes. There is a design pattern which could help and it's called Dependency Injection (DI). It allows you to inject objects into a class, instead of creating them there.
read more
-
Speed Up Your JavaScript
posted in JavaScript on 2012-04-26 javascript 2nd edition wrox contributor author slow -
As an interpreted language, JavaScript is filled with hidden performance issues that conspire to slow down your code and ruin the user experience. Learn exactly what is fast, what is slow, and what you can do to squeeze that last bit of performance out of your JavaScript code.
read more
-
REBIRTH of GAEA - Flowing Meditation
posted in Inspiration on 2012-03-10 rebirth gaea flowing meditation -
A layer-by-layer deconstruction of "Flowing Meditation," part of REBIRTH of GAEA, an epic visual tapestry delicately interweaving reflections on the environment and spirituality through the rich imagery of Greek Mythology.
read more
-
JavaScript object creation
posted in JavaScript on 2012-03-04 javascript discusses object creation peters discusses object keith peters discusses article keith peters operator check prototypal inheritance alternative -
In this article, Keith Peters discusses object creation in JavaScript using prototypal inheritance as an alternative to the new operator. Check out here.
read more
-
PEAR PHP Coding Standarts
posted in PHP on 2012-02-29 pear en standards php manual en standards net manual en php net manual pear php net http pear php folks http pear pear folks http distribution coding standards -
The PEAR Coding Standards apply to code that is part of the official PEAR distribution. Coding standards often abbreviated as CS among developers and they aim to keep code consistent to be easily readable and maintainable by most of PEAR folks.http://pear.php.net/manual/en/standards.php
read more
-
MySQL vs JSON file data storing
posted in PHP on 2012-02-12 records requests data json ms time request mysql res count array function -
I'm not exactly a performance perfectionist, but currently I'm working on a tool which will be used in a large system. It will deliver texts to a multi-language environment and there will be several sites/apps which will performe big amount of request to it. It is the right moment for me to choose how to speed up my code and the work of the tool overall.
read more
-
The Dependency Inversion Principle
posted in Architecture on 2012-01-24 depend abstractions dependency inversion principle abstractions b abstractions low level modules high level modules higher level components inversion principle relates abstractions read details details -
The Dependency Inversion Principle relates to the stability and reusability of higher-level components within an application. The principle states:_A. High-level modules should not depend on low-level modules. Both should depend on abstractions.B. Abstractions should not depend upon details. Details should depend upon abstractions._Read more here.
read more
-
The Single Responsibility Principle (SRP)
posted in Architecture on 2012-01-03 principle responsibility class responsibility principle srp single responsibility principle software design read hard changing motive opinion fundamentals -
In my opinion that principle is really important and stays in the fundamentals of software design._In the context of the Single Responsibility Principle (SRP) we define a responsibility to be "a reason for change." If you can think of more than one motive for changing a class, then that class has more than one responsibility. This is sometimes hard to see._Read more about this principle here.
read more
-
The Open-Closed Principle
posted in Architecture on 2011-12-18 principle classes modules functions entities classes modules software entities classes called open closed robert c martin great article modification extension -
That's a great article by Robert C. Martin. It's one of those articles that really may change something in your programming. The principle is called Open-Closed and it says:_SOFTWARE ENTITIES (CLASSES, MODULES, FUNCTIONS, ETC.) SHOULD BE OPEN FOR EXTENSION, BUT CLOSED FOR MODIFICATION._More about that here.
read more
-
How TDD and Pairing Increase Production by anarchycreek.com
posted in Architecture on 2011-12-12 pairing increase production tdd period http anarchycreek article period http great article period -
Just a great article. Period! http://anarchycreek.com/2009/05/26/how-tdd-and-pairing-increase-production/
read more
-
Testing Facebook application
posted in JavaScript on 2011-11-29 facebook function php testing var fb config id sdk check -
I had a lot of work these days and didn't have time to blog here, but I think that the tips in this article are very useful. The number of Facebook applications is increasing every day. We all know that the testing (debugging) of our code is really important. That's why I decided to share my experience in this area.
read more
-
Adobe\'s strategic transformation and the Flash Platform
posted in ActionScript on 2011-11-20 adobe adobe community read full article social connections touch interfaces fundamental transformation change innovation time devices -
Adobe is in the midst of a fundamental transformation. We are transforming from software in boxes to solutions in the cloud, and to a world of touch interfaces on devices, and social connections everywhere. This is a time of both innovation and change for Adobe and for the Adobe community ...Read the full article here.
read more
-
Filtering data with jQuery
posted in JavaScript on 2011-10-11 var rows function var vowels consonants filtering filterinput data input filter user -
We are working with data every day and there is a part of our applications, which is responsible for presenting the information to the user. Sometimes we need to show a lot of records and then we are using pagination or additional server requests to filter the data. A little JavaScript code could change the things a lot - fast data filtering and better user experience.
read more
-
The top 10 SEO myths by Mark Buckingham
posted in Other on 2011-08-20 s matt mcgee land s matt engine land s search engine land s matt cutts google s matt asks leading experts engine optimisation myths search engine optimisation favourite search engine search marketing consultant -
_Search marketing consultant Mark Buckingham destroys his 10 favourite search engine optimisation myths and asks leading experts such as Google's Matt Cutts and Search Engine Land's Matt McGee for their opinion._Check out here.
read more
-
AS3: Tracing in Flash/Flex
posted in ActionScript on 2011-08-16 import flash public str function debug movieclip void trace swf class -
Inspired by the article of Dru Kepple I decided to share my experience in Debugging processes in flash/flex enviroment.
read more
-
AS3: DataGrid with custom ItemRenderers
posted in ActionScript on 2011-08-11 date data rating datafield var row import mx column private function void datagridcolumn -
One of the big advantages of Flex framework is that you can use a lot of ready components. The DataGrid is really helpful. Especially when you want to list big amount of data and provide ability to edit the information directly in the grid. These days I finished a test task which uses DataGrid and decided to share my experience.
read more
-
A RobotLegs Book
posted in ActionScript on 2011-07-22 book robotlegs joel hooks finished information read -
@Stray and @Joel Hooks finished their book for RobotLegs. Definitely it is something that you should read. More information here.
read more
-
AS3: Creating Facebook Application
posted in ActionScript on 2011-07-08 facebook function response http application log friends id api -
Facebook became one of the most popular social platforms these days. I just finished a flash based game that uses their API and decided to share my experience.
read more
-
GoogleMaps JS API: address to coordinates transformation
posted in JavaScript on 2011-06-01 map google maps function address locations var results location google maps latlng step -
When we are talking about maps, Google is an absolute leader. Their GoogleMaps tool is free, well documented and works really good. What I didn't find directly in the documentation is how to get the exact location based on plain text. I.e. to convert an address to google.maps.LatLng object. That's why I wrote a simple function that did this job.
read more
-
5 useful ActionScript 3 tips
posted in ActionScript on 2011-05-24 movie color function date movie getchildat month number return tips -
Sometimes, when you work on some project, you find something that is small, but very interesting and useful. Usually I'm adding such kind of things in classes that I like to call helpers. The following tips are part of my helpers.
read more
-
AS3: dynamic text field to curve (TextField on an arcing path)
posted in ActionScript on 2011-05-04 text var curvedtext textformat number radius tf direction endangle startangle -
[2]Most of the articles here are tightly connected to my daily work. As you probably know from one of my latest posts (runtime font loading/embedding) I worked a lot with texts these days. There was a request for producing curved text from a dynamic field. Of course it wasn't so easy to create such a feature. I wrote a simple class that did the job and I decided to share it.
read more
-
AS3: converting XML to JSON object
posted in ActionScript on 2011-04-02 label url image xml id img cdata node var version xml2json class http site int childnode object -
I'm absolutely sure that you are using external data in your flash/flex applications. It is a good practice to transfer information in XML format. Most of the projects that I'm working on also use XML and in most of them I have a class that converts the data to JSON object. The problem with this workflow is that the parser's logic is always different because the XML is different. These days I wrote a class that solved this problem and directly converted every given XML file to a JSON object.
read more
-
OOP in JavaScript (part 2)
posted in JavaScript on 2011-02-22 child function parent prototype getname superclass parentclass childclass prototype extend child parent getname function return -
I already wrote an article on this topic (Object Oriented Programming in JavaScript (Extending / Inherit classes)), but last few days I realized that there are some things that I didn't explain.
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
-
Creating mp3 player with RobotLegs (basics tutorial)
posted in ActionScript on 2011-02-09 import public function event data preloaderevent robotlegs events class -
Have you ever wondered how to optimize your ActionScript applications? Have you searched for a nice framework that will save you a lot of time and will organize your structure? If yes then RobotLegs is for you. In this article I'll show you how to use it to create a simple mp3 player which loads a configuration xml file, parse it and play mp3 files.
read more
-
GoogleMaps API v3: convert LatLng object to actual pixels
posted in JavaScript on 2011-01-07 map var map getprojection fromlatlngtopoint worldpoint scale object fromlatlngtopoint map getbounds getprojection fromlatlngtopoint map -
It is not so easy as it looks like. You should get the map object's projection and the map's zoom to be able to calculate it.
read more
-
JavaScript: managing events (dispatch, listen)
posted in JavaScript on 2011-01-06 function event events dispatch classname type eventbus addeventlistener testclass2 testclass1 var -
As a huge fen of the flash platform, I always like to work with events. The events system in ActionScript3 is really helpful when we are building a big application with many modules and we want to keep them independent. JavaScript hasn't native support of events, but we can still use them.
read more
-
AS3: Using custom Metadata in Flex (part 1)
posted in ActionScript on 2010-12-28 metadata public flex mycustomclass information metadata tags tag as3 flash utils describetype public function mycustomclass -
I'm sure that you've already used metadata tags in your flex applications. There are several reserved keywords like [Bindable], [Embed], [Event] and so on (the full list is available here). The function of the metadata tags is to provide additional information to the flex compiler. For example information about embeding assets, dispatching events. This article doesn't explain how to use the default flex tags (you can learn that from here). It shows you how to create your own metadata tags and how to use them.
read more
-
Delegation in JavaScript
posted in JavaScript on 2010-12-27 var numofargs arguments length var numofargs arguments args var numofargs var args var delegate scope method function delegate scope delegation -
I think that the delegation is an important part of every programming language. It is also possible in JavaScript.
read more
-
Object Oriented Programming in JavaScript (Extending / Inherit classes)
posted in JavaScript on 2010-12-23 function baseclass class childclass var getname subclass2 subclass1 extend -
As you probably know JavaScript is not exactly OOP based language. Of course there are some ways to handle with this and you can still create classes and inherit them. It is much much better to use classes. Your application will be well structured and split to modules.
read more
-
Change the quality of all the bitmaps of your flash document
posted in ActionScript on 2010-12-15 problem bitmaps arsthanea check flash provided ve met extension jsfl solutions edit library -
I know that you've met this problem. You have a lot of bitmaps in your library and you have to edit all of them one by one. There are several solutions of this problem. One of them is to use JSFL. There is another one - an extension for Flash provided by ArsThanea. Check it out here.
read more
-
Scaling rounded corners in Flash
posted in ActionScript on 2010-12-11 clip grid clip slicing height width void function rectangle resizing -
I'm absolutely sure that you've already met this problem. You know, these nice rounded buttons that are provided by the designer. They are really cool, but sometimes the label of the button is so long that you have to resize/scale the image. ActionScript3 provides simple way to solve this issue.
read more
-
Javascript: autocomplete country script
posted in JavaScript on 2010-12-06 field function helper ac countries var loop div script javascript -
We are all filling registration forms. It's really nice when the page helps us to do that faster. The script, that I'm going to show you, is designed to be used for a country field.
read more
-
PHP: export data to XLS file
posted in PHP on 2010-12-01 xlswritelabel echo pack 0x0 function content type application header content type download header content row col 0x0 echo pack ssssss -
Sometimes it is necessary to present your data in format which is popular and easy to work with. In most cases the CSV format will fit perfectly you and your clients, but sometimes you have to export the information in XLS file. These several functions will help you to do that.
read more
-
Deep linking in flash with AS3
posted in ActionScript on 2010-11-14 flash page function hash address deeplinkingclass dl html swf home -
Many people will say that Flash is not SEO friendly. Actually that's not 100% true. Flash is just a tool that shows your data. Exactly the same as the HTML. In this article I'll show you how to use ActionScript3 and JavaScript together to make your flash sites SEO friendly and provide a different URL for each of your pages.
read more
-
Adobe AIR: how to make things upon closing the application
posted in ActionScript on 2010-11-03 application closing things -
Sometimes we need to catch the closing of our AIR application to make some things like storing the window's position and size. We can do that in our code.
read more
-
How to protect your SWF file
posted in ActionScript on 2010-10-15 function swf protect void check file import flash public ondatafiledtoload onfailed files string -
Is there any way to protect your flash work? To be honest the answer is NO. As you probably know everything that is uploaded on a web server and is accessible from a web browser is downloaded to the users' computers and could be found in the temporary directories. Once someone gets your swf file he could use one of the dozen decompilers to reproduce the .fla and .as files. Anyway, there are still some ways to make stealing difficult.
read more
-
Cloning JSON object in JavaScript
posted in JavaScript on 2010-10-04 obj obj1 outpurarr var document write obj2 object getname function return obj var outpurarr clone obj var function clone obj -
Simple and easy solution.
read more
-
Great review for krasimirtsonev.com
posted in Other on 2010-09-27 site navigation simple link clean column tim martinez background work -
Special thanks to Tim Martinez for his review in HumberInteractive.com.Tim Martinez:"The site I chose is the portfolio site of Web Designer and Developer, Krasimir Tsonev.When you hit the site, right off the bat you’re presented with a simple pre-loader and then up comes the navigation. I like the navigation because it starts off centred and one column. I like that the focus is on the navigation and it’s just so clean. The menu has a large font and is easy to read, plus you get a cool rollover. Now when you click on something in the navigation, it gives you what you want right away. When you click on “Work”, then the navigation shifts over and you get a two-column thing going on. The second column then has the submenu items under Work and you get sweet rollovers again. The site’s functionality is very simple. The site’s layout is just so simple. I like it.
read more
-
How to create realistic Earth globe in Flash (AS3, Papervision3D)
posted in ActionScript on 2010-09-16 stage globe var import org papervision3d rotationx rotationy moviematerial sphere stage stageheight stage stagewidth -
Papervision3D is a perfect tool for the purpose. As you will see such a task needs only few lines of code. To make the example a little bit more interesting we will add additional code to control the rotation of the globe by the mouse.
read more
-
Apple App Store Opens its Doors to Adobe Flash
posted in Other on 2010-09-14 flash devices twitter lit ios devices twitter party development tools 3rd party development apple announce removal active tutsplus full article speculation began blogosphere jumped -
_"Yesterday saw Apple announce removal of the infamous restrictions on 3rd party development tools for iOS devices. Twitter lit up, the blogosphere jumped into gear and speculation began in earnest. So what’s this all about and what does it mean for Flash?"_The full article on active.tutsplus.com here.
read more
-
Pixel perfect in Papervision3d
posted in ActionScript on 2010-09-12 camera papervision3d -
Did you ever wonder how to create a pixel perfect animation in Papervision3d? I designed my portfolio site in Photoshop, but when I tried to integrate the 3D effects I spent a lot of time in changing the zoom and focus length to match the exact dimensions. And even then they were not perfect.
read more
-
Distort MovieClip in Flash with AS3
posted in ActionScript on 2010-09-05 getrandomnum clip setting mtd tweentype out_expo end getrandomnum distort private function number movieclip distortimagewrapper -
As you probably know there is no simple way to distort a MovieClip in Flash. The solution that I've found uses AS3. Special thanks to Thomas Pfeiffer and Ruben Swieringa. They share their experience with this problem.
read more
-
Export mysql data to SQL script or CSV
posted in PHP on 2010-09-04 server data mysql export good solution phpmyadmin didn t work export data php file mysql exe mysql server received host -
Yesterday I received host name, user name and password for a MySQL server. I needed to export the data from it. I didn't have access to PHPMyAdmin, I tried to connect to the server by mysql.exe on my PC, but it didn't work. And then I found really good solution - PHPMyAdmin in only one php file. I launched it from my localhost and it works. So if you need to export data or just see it, use Adminer. I also uploaded the file on my server, you can download it from here.
read more
-
Duplicate loaded images in AS3
posted in ActionScript on 2010-08-30 duplicate target var rect movieclip function bitmap loader import flash display target parent -
During the creation of the latest changes in my portfolio site, I needed to duplicate a loaded image that has to be placed as a material in papervison3d's cube. We don't have duplicateMovieClip in AS3, so we have to use another technique.
read more
-
How to use Google Maps API in flash
posted in ActionScript on 2010-08-19 import map flash google maps icon private function adding setting mapevent api -
Google offers a lot of free tools for us. One of them is really useful and easy to work with - GoogleMaps API. In this article I will show you how to import a map in Flash and place an icon in a specific place.
read more
-
Create your own tween manager class in AS3
posted in ActionScript on 2010-08-07 arr ease startpos calcendpos steps var calcendpos steps break object steps break case properties start public function -
There are some features in Flash that we can't work without. Tween classes are among the most used ones. They give you ability to animate objects without using the timeline, to change the animation fast and easy. The idea of these classes is very simple. That's why I think that it is a good idea to have your own tween manager that you can modify to fit into your needs.
read more
-
Delegation in AS3
posted in ActionScript on 2010-08-02 function param2 func param1 delegation -
I just can't code without delegation. I'm using it every day and wanted to share this method with you.
read more
-
Papervision3d: Finding 2D coordinates of a 3D object
posted in ActionScript on 2010-07-25 private var 3d number import org papervision3d addsphereandtooltip item mousey mousex basicview displayobject3d event -
Papervision3d is probably the most popular 3D flash engine. There are dozen of applications/sites that use it. These days I also decided to create a 3D effect in my portfolio site. Everything works fine, but I needed a tooltip for each of the 3D objects on my scene. To be able to animate everything I needed 2D coordinates of all my 3D elements.
read more
-
Trace JSON object in AS3
posted in ActionScript on 2010-07-17 str description gettypeof o spaces var object information users -
I'm absolutely sure that all of you are working with JSON objects. It's pretty helpful to be able to print them and find out what exactly they contain. I wrote a simple function that makes this possible.
read more
-
Customize ComboBox in Flash (AS3)
posted in ActionScript on 2010-06-17 combo tf data import flash dp additem label customcellrenderer function combo textfield setstyle oncombochange cellrenderer movieclip -
In my work as a flash developer very often I receive from the client just one photoshop file with the design of the application/site that has to be coded. In the last project the designer made the ComboBox in the style of the site. So I couldn't use the default look of the Flash's drop down component.
read more
-
Code Flex applications with FlashDevelop
posted in ActionScript on 2010-06-07 flashdevelop flex project project9 press f5 project select flex property8 choose project location property8 choose sdk location property8 flex sdk location change flex sdk - read more
-
Tween Manager Class in AS3
posted in ActionScript on 2010-03-16 customproperty object tween tweenmanager xtween property function change tweenmanager tween loop end -
TweenManager is ActionScript3 class that helps you to animate your objects in flash. You don't need to create timeline type animations, because you can control every property of the object. Also it helps you to create a sequence by different animations/events. In the examples below I'll show you how to use the manager to solve different problems during your daily flash work.
read more
-
Remove the yellow border in flash/flex
posted in ActionScript on 2010-02-26 stage stagefocusrect false easy stage stagefocusrect post rockabit solution -
The solution was so easy: stage.stageFocusRect = false;Thanks to Rockabit for the post here.
read more
-
SVET - web based project management system
posted in Other on 2010-01-05 project management system based project management web based project svet make detailed reports specific period working time online notebook work basically -
read moreFinally I finished some bugs of my own project management system and I think it's ready for use. SVET is one of my biggest projects and it's a web based project management system, that helps you to organize your work. Basically it's an online notebook which you can use to store the information for your projects. It enables you to track your working time and communicate with your team and clients. You can also make detailed reports of what you've done for a specific period of time. Please check out here.
-
FILMEFEX Studio
posted in Inspiration on 2008-09-15 filmefex studio picture industry check motion picture industry special effects facility create effects design -
read moreFilmefex Studio is a special effects facility, where they design and create effects for the motion picture industry. Check out here
-
Google Chrome announcement
posted in Other on 2008-09-11 google chrome key engineering decisions interpretationof key engineering comics interpretationof key scott mccloud hood - read more
-
The website is down !
posted in Fun on 2008-09-04 tech support person video clip hilarious fun video clip life - read more
-
Words vs Colors
posted in Design on 2008-08-28 colors desired emotional effect words making choose designers simple association quantify attempts website - read more
-
5 helpful tips in photoshop
posted in Design on 2008-08-26 tool zoom layer click press selection keyboard button quick mask mode -
1. Moving background layer - sometimes you want to move the background layer. But by default it's locked. So just click twice on the layer and choose "OK" in the popup message. The layer will be transformed to normal layer.
read more