Vue — GraphQL — AWS Lambda

UPDATE: The provided Vue boilerplate is now using Prisma and Auth0!

The serverless architecture is gaining more and more followers as new frameworks and services appear in the market. The most common monolith architecture was replaced by micro-services in many projects, which improved scalability but raised complexity. Recently, the latter gave way to the so-called serverless architecture.

Rather than deploying a whole server, now it is possible to worry only about custom code that runs at specific timing during the application. For instance, whenever a new user is registered in the DB, there will be a hook or event where…

In case you didn’t know, Onsen UI’s dark theme was released some time ago. Either if you want to make an app for hackers or simply a night mode of your existing app, you should check it out!

Onsen UI Dark Theme

It is provided as onsenui/css/dark-onsen-css-components.css in versions ≥ 2.7.0. CSS variables are located in onsenui/css/dark-theme.css .

Theme Roller

The new Onsen UI Theme Roller app is alive! Make your own theme or just tweak the existing ones easily with this new online tool. It is available here.

From Onsen UI 2.8, the app size will be much smaller than before!

The new version of Onsen UI (2.8.x) was released some days ago with some interesting changes:

Bundle Size 50% Down!

Since v2.2.0 we have been refactoring all the code (class inheritance, etc.) in order to reduce the size of Onsen UI. Thanks to this, the size did not increment too much even though we were adding new components and features in every release. However, the overall size was still high.

In version 2.8, we have reduced the bundle size by more than 50%. From 657kB in 2.7.2 to 327kB in 2.8.0 (onsenui.min.js) . The main reason was switching the bundling tool from Webpack to…

Vue’s declarative nature in action

Swiping Tab Bar

Cordova apps and Progressive Web Apps targeting mobile devices are very trendy nowadays. Delivering a native look and feel is key to improve user experience and engagement but is not always an easy task. Sure thing, creating styled checkboxes and radio buttons is not an issue at all but the real features that provide the quality jump we seek are based on user interaction.

A swiping tab bar splits the content into different pages and allows the user bringing the desired page into view with his/her own finger. What if, at the same time as the user drags the page…

Onsen UI provides native-like styles for all the UI components that presumably work for most of the situations. However, sometimes we want to give our apps a personal touch in the shape of custom styles or animations. Let’s learn how to quickly implement custom “modifiers” to alter the style of our components in this article.

About “modifier” attribute

Every visual component in Onsen UI accepts a modifier attribute that alters its style. Modifiers are a cross-component way to provide visual customizability. A modifier is translated into a set of CSS classes not only for the own element but also for its children. …

The YouTube Jukebox app has been updated to Onsen UI 2.0 + AngularJS and now includes a Material Design version. This app uses the YouTube Data API v3 to fetch videos and display them in our hybrid apps. Learn more about the included changes here.

YouTube Jukebox sample app was released some time ago for Onsen UI 1. It has a tutorial about how to use the YouTube Data API v3 with AngularJS in Onsen UI that is still completely valid for Onsen UI 2. You can check it out for more details.

YouTube Jukebox

The source code of this application is…

The fact that Onsen UI is built on top of Web Components makes us proud to be framework agnostic. However, there are so many options out there that we can feel overwhelmed when it comes to choosing a front-end framework to develop with. Especially for those who don’t have a large background in web programming, deciding which framework works better for them could be a tedious task.

Have you already chosen your framework to work with Onsen UI? For those who still don’t have a preference, in this article we show how to make a simple Hello World app with…

Onsen UI 2.0 final release is around the corner. We’ve come a long way since we started implementing this version and we want to explain you here what were our reasons and issues. This is a short article that breaks down Onsen UI and some of the technologies behind it.

From AngularJS directives to Web Components

Onsen UI 1.x was built on top of AngularJS, a revolutionary framework for its time that is getting replaced nowadays by some more lightweight and newer ones. In AngularJS it is possible to define directives, markers on a DOM element (mostly as element names or attributes) that allows attaching a…

Meteor is very well known as a full-stack framework that tremendously simplifies the creation of web apps. Thanks to Cordova we can also use Meteor for hybrid mobile apps and, after the last changes we made to our framework and bindings, we are excited to announce that you can find a robust Meteor Mobile UI framework in Onsen UI.

In this post we show you how to easily combine Meteor with Onsen UI to create beautiful looking mobile apps.

Why Meteor + Onsen UI?

Meteor is a great technology for web apps. It offers a high development efficiency by abstracting many aspects behind its client-server…

Onsen UI 2.0 Release Candidate was released last week together with React Components for Onsen UI. Angular2 extension is on the way and at the same time we are focusing on improving Onsen UI development stack, e.g. tools and services complementing our framework that will make your development process much smoother. Here you have the latest news around Onsen UI.

We decided to improve Onsen UI’s development environment and community tools and few months ago we released Onsen UI x Monaca Community Forum. This forum has so far gathered, together with the already existing Gitter Chat, a bunch of developers…

Fran Dios

I create apps from Tokyo with love. I also like tomatoes.

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store