web dev notes

Posts by Joan Maria Talarn Espelta

jmtalarn avatar

I'm a web developer with a career based in java language (Struts, JSF, hibernate) but with a lot of experience in the frontend also (HTML5, CSS3, javascript). I worked also with the Node.js and Express in the backend, and experience with NoSQL and SQL databases.

Although I could take any responsability in the development stack as software engineer recently I did a strong turn around to the frontend development getting specialized on it. Working intensively with Javascript and React and many other related things like technical SEO.

I'm really interested with the challenge going a step ahead in the user interface (UI) development and improving the user experience (UX) as is the interface between the most complex entities, the humans, and the computers.

Theming your stylesheets with css variables

jmtalarn

2018-11-13 10:50:12

WEB DEVELOPMENT

What are CSS variables?
The CSS variables are more accurately known as CSS custom properties. You can define a value under a variable key and use it along your stylesheets wherever is in its scope. They can be very useful to avoid CSS repetition, with a better performance in run time for things like theme switching and very useful for extending or 'polyfilling' future CSS features.

Migrate a blog from Wordpress to Jekyll

jmtalarn

2017-9-22 21:38:28

WEB DEVELOPMENT
BLOGGING

In this case the situation was the end of life of Openshift v2, the platform I used to host (for free) the WordPress blog. As I was not yet accepted in the program of Openshift v3 I decided to try an alternative. So I had access to a static hosting and I moved all the content from Wordpress to Jekyll. Jekyll is a static site generator and as I described in a previous post there is nothing bad with that if you use the correct tools.

Build and publish a Ionic App – Live update of Firebase backend with AngularJS

jmtalarn

2017-8-18 12:28:28

APP DEVELOPMENT
WEB DEVELOPMENT

We wanted to create a kind of live update of the Firebase backend while the users were using the app avoiding to put Save button actions in order to save. The idea is to keep the backend updated while the user is creating or updating any element, these are ToDo items and category elements, in our application. So we needed to implement a system with the help of the library Angularfire and the $watch AngularJs function to make it happen.

Free practical courses to learn about modern web development

jmtalarn

2017-8-4 16:35:45

WEB DEVELOPMENT

Four FREE practical courses about modern web development that will put you on the track of the web modern development. AngularJS, Progressive Web Applications (a.k.a. PWA), Javascript with ES6 new features, Firebase and React.js. All of these cover from basic to advanced aspects of the web development, but necessary if you want to be on top.

Build and publish a Ionic App – Views and routes

jmtalarn

2017-6-3 00:30:28

APP DEVELOPMENT
WEB DEVELOPMENT

When we generate the application using the Ionic CLI it generates the application structure to manage three tabs Dash, Chats and Account. Angular provides a main module as the core framework and the additional required functionalities are added via modules like the URL mapping and routing. In the app skeleton generated each one of the tabs is considered a view or a state (actually that are substates of a tab state) and each one is related to an URL. Angular provides generally two modules as options to manage the URL routing: Angular ngRoute and AngularUI Router. Ionic uses by default the ui-router.

20 free plugins to power-up your Wordpress blog

jmtalarn

2017-4-28 21:35:56

BLOGGING
WEB DEVELOPMENT

Wordpress is system with a rich ecosystem of plugins. There is a plugin for anything you can imagine, some of them have a cost but most of them are free. Here is my personal list of plugins I used in the last blogs I've built with Wordpress. All of them are FREE and some of theme have a paid version but are fully functional in the free version.

Migrating from Ghost to WordPress over Openshift

jmtalarn

2017-4-14 22:51:09

BLOGGING
WEB DEVELOPMENT

Until now, I was blogging using Ghost platform over Openshift. I love the way you develop new features over the Ghost platform: Handlebars for the templating, an easy API to get information about the blog and their posts... and you are using the Node.js on the backend so you're feeling a little bit hipster while you're using it.

Crowdfunding FontAwesome5 and Modular Javascript

jmtalarn

2016-11-2 00:45:58

WEB DEVELOPMENT

The past week I backed for two projects. Every time I was minimally interested in a crowdfunding project where about physically products that need the fundings to make the production so I never decided and finally never backed. But this time I found two projects that really interested me and I think that they can help me in my work and development career.

HTML5 template - Structure and Tags

jmtalarn

2016-10-8 01:54:20

WEB DEVELOPMENT

Take pen and paper and just write it on... or better take your favourite editor and create a new file. Basic structure
The following declaration will declare the file you're writting as an HTML5 document ```html ``` The document will be mainly composed with opening and closing tags declaring what is the contained inside the two tags.

HTML Documents

jmtalarn

2016-9-15 13:51:40

WEB DEVELOPMENT

The HTML (which stands for HyperText Markup Language) is the base of the documents creating the Hypertext, or extending the concept to all media available, the Hypermedia. In these documents we can set the information showed on the Hypertext terminal. The most common implementation is the well known "World Wide Web" where their hypertext terminals are generally the Web Browsers.

web services - xml based vs json based

jmtalarn

2016-9-7 17:14:50

WEB DEVELOPMENT

When we talk about a web services we are referring to a software installed on a server with the function to provide a communication and interaction with other machines, acting as clients, using the posibilities that a web server can provide to communicate basically through the HTTP protocol.

Basic concepts about web servers

jmtalarn

2016-8-31 22:03:00

WEB DEVELOPMENT

When we talk about web server we are referring indistinctly to the software providing web content and the machine is running it.
Generally a web server is a software providing web content to the clients connected to them, usually web browsers.
This software is running listening on a port and when a client makes a request over the http protocol to a determined resource, usually via the get method, it is sent to the client as response.

random data generator for tests

jmtalarn

2016-8-11 23:25:19

WEB DEVELOPMENT

Many times your imagination is over when you are testing some data introduction and your form inputs are finally filled with boring and repetitive text that doesn't help you. aaaaaaaaaaaa asdasdasd 12345 qweqweqw AAAAAAAAA ASDASDASD cfjsdkl fldcfamj lfah caom h Instead of using non-sense words or useless terms you can use some of the following generators to get data and text in order to fill your forms. This will help you to have a results in your tests more close to the final data that could be filled in your applications.

The undervalued static web sites

jmtalarn

2016-7-25 13:38:25

WEB DEVELOPMENT

When you are going to build a new web site, most of times you go through it thinking about the technology you'll use to build it. Maybe you want to be on the cutting edge and you'll use the latest or rarest content management system like Ghost or maybe you'll use a wide extended system and full of available plugins (I've a mention about these later) like Wordpress.

Boosting your career as developer

jmtalarn

2016-7-2 16:42:24

BLOGGING
WEB DEVELOPMENT

I was fired. I left a job that I have been for 5 years to a new career opportunity that offered me go ahead in my career as web developer. It had everything you looked for when you imagined an ideal job. Freedom for choosing technologies to develop with, once per week telecommute, no dress code ...
everything was like an startup environment even there was a table for playing table tennis.

Express app and a Ghost blog together

jmtalarn

2016-1-26 03:35:12

BLOGGING
WEB DEVELOPMENT

If you know anything about Ghost development surely you know Ghost is based with the Express framework over the Node.js server. Well, maybe someday you want to add an extra superpower to your blog taking advantage of your javascript development skills over Node.js.
You can put it all together and play with all this stuff.

Compiling Sass with Maven or Gulp

jmtalarn

2015-10-21 14:28:23

WEB DEVELOPMENT

Sass compiling from Maven You can compile your sass css source files from your java projects build with maven with the **sass-maven-plugin**. You can find the source code at GitHub https://github.com/Jasig/sass-maven-plugin, and find it on the Maven Central Repository. You should configure your maven pom file to properly use the plugin as needed.

Sketching with Pencil

jmtalarn

2015-8-17 03:50:00

DESIGN RESOURCES

**Evolus Pencil** is an open source software for prototyping and sketching and is what I use as a free alternative to all the web based existing applications to do the designs and wireframes. It has many bundled stencils collections to use based on Android,iOS and many web frameworks components ...

Numix, not just yet another theme suite

jmtalarn

2015-7-22 05:48:32

DESIGN RESOURCES

**Numix** is a great project composed by many design artworks like icons and backgrounds to use on your Linux desktop distribution. The good design and taste of all of its elements converts your bored distribution into a beautiful pleasant for your eyes experience. And it also can be applied in your Android devices.