I’ve been working for a while with Node. Learning, experimenting and doing some small projects for clients. At Cloudry (yes, we founded small web dev agency in late 2012) we are using Node for particular type of projects. Writing code from scratch is a great idea, for those who learn Node. But in day-to-day workflow it becomes really annoying and time consuming process.
Check all of these talks from EdgeConf if you missed it. There are so much hot stuff for developers. Learn more and enjoy.
I was looking for some compatiblity info about styling HTML5 placeholders on mobile with CSS and it seems nothing for me on the internet. So I made this quick test page which includes a form with two input fields ["text", "password"] and textarea. Each one has a placeholder attribute with some text that you should see in those fields as an actual placeholder.
In terms of DOM structure, placeholder is just an element inside input or textarea elements. It seems to be weird, normally you type nothing but the only element. But there’s one thing called Shadow DOM. It’s a place where a lot of stuff lives, the reason why some elements are hidden from the normal DOM is because usually there’s no need to have an access to some UI stuff like placeholder, video and audio player controls, etc. Think about those elements as components with some basic things inside.
As a front-end developer I’m using a lot of tools in my everyday workflow, and the most efficient way of handling them is from the command line. Unfortunately native Windows command line cmd.exe doesn’t achieve all requirements for better front-end development. What I was looking for is simplicity and functionality. And I think Console2 is the exact tool.
If you are passionate about workflow optimization and efficiency you probably already using a bunch of tools and definately you’ve heard about LiveReload. The tool monitors changes in the file system and refreshes browser on file save. For CSS it’s updating without refreshing. As the result you are saving time for refreshing browser which can you used for more advanced tasks.
This is a simple hint for those who wonder how to start using local server to work comfortably with the code. The reason why front-end developer may want to run the code from the localhost is that a bunch of diff dev tools runs properly only with files served on the server, also you’ll need the local server for developing web apps with using of XHR. To start the server with ease, you’ll need Python installed.
Web Audio API is a JavaScript API for processing and synthesizing audio.
It is a goal of this specification to include the capabilities found in modern game audio engines as well as some of the mixing, processing, and filtering tasks that are found in modern desktop audio production applications.
This is a very powerful API that we haven’t had before. Now developers can create diff audio synthesizing and filtering apps or audio in games just with JS. At the moment you can try it in Chrome (prefixed since 10), Safari 6 (prefixed), iOS Safari (prefixed), Firefox (since 17) has an alternative, deprecated API, called Audio Data API.
Recently I created small tool called img2css, this is a nice way to convert any image file to pure CSS image. As an output it produces pixels based on box-shadows or div elements. There are client-side and server-side implementations of the tool. The client-side as simple as it is and can be too heavy for your machine while processing pixels. The server-side img2css built with node.js using WebSockets for real-time data transferring, server-side processing allows to convert files with much bigger resolution in less time. Here I want to make a small review of the code and show how does it works.
CSS Shaders is a part of the W3C’s Filter Effects 1.0 specification. It allows using of CSS Custom Filters for applying them to the HTML content through CSS, to create reach visual effects. At the moment shaders support implemented as the experiment in Chrome Canary 24.
As every developer, I’m in love with tools and libraries that helps me do my job better and faster. Web moves forward and we shouldn’t fall behind it, everyday there are a lot of awesome stuff appears. Now development tools becomes more valuable than ever before. They makes our job easier and more consistent, and as a result you are able to create more awesome stuff in less time.