JavaScript for Line of Business Applications

When I read Atomic Product Development a few weeks ago, it was a lightbulb moment for me. It managed to finally put words (and code!) to the handful of loose ideas that had been rattling around my head for the better part of a year. I've started contributing to the project, and you'll undoubtedly hear more about it from me in the future, but I thought it might be helpful to first show a basic application of the concepts to AngularJS.
The atomify projects (specifically atomify-js and atomify-css) were not created with frameworks like AngularJS in mind. If you take a look at the atomify-example, you can see it's more like Backbone or vanilla JS, but the principles and underlying tools are universally appealing.

Therefore, the challenge I've spent the last couple of weeks solving is how to utilize that foundation in the context of AngularJS. As it turns out, it's actually pretty simple.

I would like to show you how Chosen can be quickly integrated into your EmberJs application together with Twitter Bootstrap.

I’m currently working on web application. We use JavaScript MVC web framework called EmberJs. It is very cool framework, and I will write about it more in the future. Ember has small set of views and input-helpers. Just using them is not always enough to build solid and rich application. Fortunately there are tons of controls available online, and it is quite easy to write your own controls with Ember.

Most of online available controls/plugins are based on jQuery (no surprises, of course) and they use plain javascript objects. Ember wraps javascript objects into Ember.Object, so it allows for data binding, data tracking and other advanced features, but on other hand it makes impossible to use vast majority of web components right away. You need to adapt them in order to to use them with Ember.

Having component created with Ember would result in application-specific html-tag, that would use JavaScript logic defined by you. Something like: <my-own-html-tag… that does and shows what you want.

Chosen. One of the controls we wanted to use was Chosen. “Chosen is a jQuery plugin that makes long, unwieldy select boxes much more user-friendly.” It allows you to have nice multi-selects that look like one below:

A quick walk throught the fresh ES6 modules spec coupled with the front MVC framework EmberJS.

The ES.current as we know it doesn’t feature a standardized module system, you cannot require some fragment of code inside another fragment of code and use it while being inside a namespace (and not a global). AMD and CommonJS came along and proposed two impressive yet incompatible solutions to let developers use modules (AMD is mostly used in the browser, while CommonJS is more used server-side). The new ES6 modules spec aims at solving this module problem and also let ES6 modules transpile to both AMD and CommonJS as a polyfill.

The ES6 modules spec is done and will not change before the ES6 specs release, we can now use it and feel safe about the new semantic we learn.

This template provides you with the basic project structure, build configuration and instructions to build your own custom component libraries for Ember.

With Ember Components now available, we wanted to create a simple template for creating component libraries. Component libraries can be built to wrap non-ember Javascript components, extend the functionality of Ember Views, and provide collections of controls which have some common/shared interaction.

However, if you want to reuse your components between projects, you’ll need to extract your components into a distinct project, and have enough build infrastructure in place so that your library can be built, exported and made accessible by dependent applications. We scoured for an existing minimal template to provide this structure, but could not find it, so we built a barebones version ourselves.

At its core lucuma helps with creating custom HTML tag elements (Web Component) encapsulating content, style and logic. It is not a fancy MV* framework and aims at being a thin layer building on top of next generation web standards (mainly Custom Elements and Shadow DOM). 

It also makes the extra effort of being flexible and open to existing ClojureScript standards and libraries.

Lucuma is conceptually similar to polymer, x-tags or Polymer.dart.

This article describes still rarely supported Shadow DOM features. 

This article will describe things to improve the checkbox component, that got built up in the last article. By improving I mean making the web component more configurable and making it stylable from the “outside”. Additionally it will cover some mistakes that were made in first place, but let us just dive into it. ;)

Last week I made a presentation for meet.js PL about React. meet.js is a free front-end meetup organized by web enthusiasts in 6 major Polish cities - Warsaw, Gdańsk, Poznań, Wrocław, Cracow and Katowice.

In a nutshell, I presented why we chose React among other available options (ember.js, angular, backbone ...) in AgFlow, where I’m leading an application development.

Also I try to highlight some problems with MVC pattern everywhere.

I really like a way of React frontend components development. It makes more clear for us to implement use cases views.

Enjoy! 

I’m often still amazed at just how well Ember deals with complexity.

Ember Components are one of many reasons for this, they very neatly allow us to create decoupled views which can be reused throughout our application. Below tag editor component which consists of 30 lines of clean JavaScript. (view the source on jsbin)

Web components promise to bring reusability and encapsulation to the next version of JavaScript. The bad news is that their power is out of reach until mainstream browsers fully implement the ECMAScript 6 standards that make up web components. Fortunately for Ember.js developers, the power of web components can be leveraged today in the form of Ember components. Ember components share more than a similar name with Web Components, they aim to adhere as closely to the W3C Web Component spec as possible.

In this article, I’ll show you how to use Ember components to build a reusable building block for a scrum card management application. For those of you who have never used Ember before, don’t worry, we’ll also cover some of the basics of Ember.js that you need to know.

Ah Markdown… Such an amazing tool. I honestly would not be writing this blog post if Markdown did not exist. I tried many times to get in to blogging but I always found the writing experience, whether it be in a GUI or WordPress’ HTML mode, too limiting. Markdown changed all of that for me and I think it’s high time we make it a full fledged member of our developer toolbox.

So today I’m going to show you how to build a Markdown tag using Polymer, a Web Components framework from Google.