Sometime when you develop a new application you don’t really need to use any backend, you can do so many things now with javascript and all html5 api but one thing you cannot do is to persist your data to be accessible everywhere (yes I just talk about database…).

When you have just few data to save in a global database it’s really boring to have to create a full backend with routing, database access, api… just in order to save few data. Recently I had to work in this kind of project were data are not so important and everything is done locally and even data is stored locally but some have to be synchronized for everyone. Usually I create a simple node server with a database access but this is too much work.

Continue to read →

Today let’s see how to create a simple infinite scroll using directives with angular.

The algorithm for an infinite scroll is pretty simple, you just have to check everytime your user use the scroll if the bottom of your element it close to the bottom of the visible area of the user (the bottom of the page because everything after will not be visible so nothing should appear after even footer ;) ).

Continue to read →

After few days without any news I come back with many ideas of article on different subjects. First of them how to let google and other search engines visit your application when this one is develop with some frameworks like angular, backbone, ember… Those kind of frameworks are really helpful to significantly improve the user experience but horrible when you want to index your pages for seo.

First we have to know how search engines works… To be simple they will just download the page associated to one url and after they will parse this page to detect you text, your links etc… So in our case, this page will return all the time the same content. Try to execute the curl command on your website and you will understand what google index.

Continue to read →

Today I will talk about comments in your code.

There is two kind of people for that.

  • The ones who comment everything in the code
  • The ones who comment nothing in the code

I will not say one solution is better than another, I will just try to explain (in my opinion) why we choose one or the other method and what are the benefits and the problems.

Continue to read →

After few days without posting because I was traveling back to france, today I will talk about one way to create a grid like Pinterest. There is many plugins to do that but most of them are really big and based on jquery so you need to load a lot of stuff just to use 10% of a library. So I decided to develop my own one just using directives in angular and this without jquery or alternative lib.

So first we will have to think about what we need.

We need:

  • to compute the width of the grid
  • to compute the height of the grid
  • to compute the number of elements per rows
  • to compute the positions of each elements

And my goal is to use it like that

1
2
3
<grid list="my_list">
  this is my element  <!-- the display of my element -->
</grid>
Continue to read →

I continue again with angular. I’m working on a new project with this framework and it’s really pleasant to use it. After directives and services today I will speak about filters.

First, what is a filter ?

A filter is something which will transform your data. One good example is the use of the filter ‘filter’ which will search in an array all elements which contains a part of the search. Filter is not limited to array, it is just an input, some parameters and you process your input to have a result so you can apply a filter on a string element or number or whatever. Perhaps you already try to display a date as string. With angular there is already a filter for this and you can simply write.

1
myDate | date:'yyyy-MM-dd'

Let explain this a bit.

Continue to read →

When I work with Ruby on Rails, I like to write the less I can for the server side part and one gem is perfect for this inherited_resources. This gem permits to create RESTful controllers without anything to write in your controller.

app/controllers/products_controller.rb
1
2
class ProductsController < InheritedResources::Base
end
config/routes.rb
1
2
3
MyApp::Application.routes.draw do
  resources :products
end

Only with this, now you can Create, Read, Update and Delete your users. It’s cool but sometimes you need to have a search or apply a scope, a pagination… For this I decided to add some module to do that.

  • Scope: Apply a scope
  • Search: Search using meta_search
  • Order: Reorder your collection
  • Pagination: Paginate your results using kaminari
  • BuildWithCurrentUser: Create/Update your resource with the current user
Continue to read →

I continue with Angular and today I will introduce how to display a loader when you do an ajax request. The classic method is everytime you make your request you display your loader then when you receive the answer you hide/destroy it. Well this is good but do this everytime is really boring and if you change your loader and you have to update the code to display/hide it it start to be horrible…

Hopefully with frameworks like Angular you can intercept your request before sending it and after receiving the response (like a before_action and after_action in Rails).

Everything happen with the object httpProvider and with two arrays transformRequest and responseInterceptors.

transformRequest is an array which store some functions to process the params before sending them. In our case we will not use it to manage the parameters but only to have a function called before each requests.

responseInterceptors is another array with a list of functions to call when the response from the server is just arrive.

Now we know a bit more about those functions, let’s start to code it

Continue to read →

After few days without writting anything, I have now many ideas of things to share, mostly about Angular. So today I will speak about geolocalisation with Angular.

If you don’t know, with html5 you can now easily know exactly where your user is, the navigator will send you the informations from the GPS, the IP address, the GSM network or wathever. For the developper, this is really simple, the navigator provide an API where you just have to call the function getCurrentPosition of navigator.geolocation and thats all :)

So today I wanted to use this API to know the position and then automatically fill the address field.

For that there is something interesting in Angular, is the possibility to create some services, a kind of module just to do something special like give the address of a user.

Continue to read →

Copyright © 2014 - Anthony Estebe -