The initiative

This Monday (2020-01-20), listening to Syntax.fm I hear about the Wes Bos' uses.tech initiative, something I see more and more in developers profiles and I found very useful to get good ideas of tools people found in their daily work.

Why I joined to the idea

I play the guitar since I was 10 years old, and in bands from the '00s, and I remember copying our favourites bands gears and configurations in a page called Guitargeek (no longer online) when I was finding my sound.

So when I saw the initiative created, I got in love with the idea to apply it to our tools as developers, and I found both uses.tech and each /uses pages super interesting to see what people are using and get improvement ideas.

Here you have mine

So I created my /uses, adding not only \"Hardware\" but the pieces of software and technology I use daily and after years of usage, I found it worth to keep in my workflow.

Feel free to visit it and hopefully get some ideas

Freelancers Day

Last July 4th, our friends from Coworking Company got the idea to celebrate Freelancers Day in Spain with the coordination of the coworking Spaces who wanted to join us.

Space Context

As you may know, I'm the co-founder of the coworking space where I work every day, which is called Corker Space, space I run with my partner Nuria Pérez.

She already got the idea to arrange talks in the space, and we found a good idea to start those talks with the opportunity which Jaime Aranda offered us by joining this initiative.

Our space is a small coworking, and Cádiz is a not a startup area, but we wanted to shake the community and find out as good talent as possible to make the event. And we really found it, super close from us.

The Conference

We luckily knew some of the speakers but also we found in the way awesome freelancers who also joined us, creating an amazing and interesting day, where we learnt a lot from each.

The list of speakers who joined as to Freelancers day (by schedule order) where:

\n
• Nuno Branco(Communications Coach) with his The Art of Conscious Negotiation, essential advice in modern times to arrive at conscious business goals.
\n
• Borja Girón(SEO Consultant) who explained how his making his living from his blog page and how to achieve it in 7 steps.
\n
• Pete Reynolds (Content Specialist) teaches all of us a super smart and simple strategy to get 10,000 visitors to your new website and kickstart your SEO!
\n
• Ines, Jesús Dani y Damián from The Branx explained us a new concept (at least for me), the Brand Experience and how the successfully apply to their clients.
\n
• Miguel Navarro Cuevas, lastly but not with less importance, walked through how much important is to set up a correct Technology RoadMap during project implementations.
\n

Such a big level 🤩!

My talk

My talk was just about what I learned and I think anyone needs to successfully work remotely, a set of tips I apply after having polish my workflow during +5 years I already spend working remotely.

So here the Google Drive Slides if anyone finds them interesting.

Conclusion

Even with the excitement which produces to talk in front of people, it was super nice to do it, get the feedback and hopefully teach something to someone.

Additionally, was great to connect and start creating a community with other freelancers who work in your local area.\nSuch events, awake your brain and boost your energies to start or push your projects, share ideas with other professionals to validate or iterate over them.

I think we all grow by sharing!

Context

As frontend developer when I want to extract information from a website to then inject into a document (usually markdown one), I do a bit of web scraping to understand how to get the data with the CSS selectors (e.g. classNames) of the elements I need from the webpage, and then I execute a simple script in the console like the following one:

copy(\n  Array.from(document.querySelectorAll('.row-title'))\n    .map(e => e.textContent)\n    .join(';;')\n);

Then in Sublime or VS Code, I paste them using those junctions chars ';;' and multi cursor capabilities of those editors to edit them as I want to give it the markdown format I need.

This time I wanted to extract the technologies of webpages with links to them to be saved in a document. But wappalyzer offers browser extensions and we can't access to the popover content of the browser extension from the console, so no possibility to extract the information from console script as I use to do.

Mission

I found this npm node module, and it opened my mind on how was the best way to use it as end-user to get the technologies used on websites and paste it into the clipboard.

I've created a lot of .sh in my career to automate dev processes, deployments, repeatable tasks using sometimes even AppleScript , but surprisingly for me, I never thought to use my web developer toolset (javascript and npm in this case) to write \"desktop scripts\". So npm scripts and this wappalyzer node module was a good start to build something to be executed with npx.

\n

I wanted to write a script to extract the technologies of any page with npm to be executed through npx and get the output from wappalyzer to the clipboard in markdown.

\n

So also the point of this \"exercise\" was not only to resolve it but with some restrictions to learn something in the way.

\n
• I wanted unit tests.
\n
• I wanted to use modules and last es6 syntax not just (it was executed inside node, so I knew it was going to be a pain point).
\n
• Register it to npm register so anyone can use it in the future or by anyone else.
\n
• And of course publish it in Github, so maybe someone can use it or make modifications to it in the future.
\n

Toolset and Planning

I found this article\"Building a simple command line tool with npm\", but was not giving me es6 modules, babel, eslint and jest. I learned how to expose npm scripts through bin property in package.json. Those scripts we link will need to have a Shebang to be executed as node scripts.

Then I knew to use last es6 syntax, node modules imports, prettier, ... I needed a tool to compile the js and my first choose was webpack, as I use to do in my web projects. But webpack it's created to build web outputs and I had to hack it to don't expect HTML, CSS and accept scripts with Shebang in the .js so I finally decided to use simple babel-cli.

Jest, was a pretty clear decision for the unit tests, without any additional configuration, as it's super valid to test functions and we don't need anything specific here like enzyme or React Testing Library.

The last piece of the puzzle was how to copy things on the clipboard of the machine, as I know in the browser console there is this copy but was not available within node. But again a ready to use node module was there to do the job (clipboardy)

Implementation

So once I was clear how to build the project, I just needed to start.

Project Init

Just created a simple and empty new folder wappalyzer-to-md and npm npm init did the rest.

mkdir wappalyzer-to-md; cd wappalyzer-to-md; npm init

Configuration .babelrc and eslint

So now let's add the .babelrc and eslint configuration:

First we install what we need for our configuration:

npm install --save-dev @babel/core @babel/cli @babel/preset-env @babel/node

And the .babelrc file looks like that:

{\n  \"presets\": [\"@babel/preset-env\"]\n}

Then the eslint ones, as I'm unable to work nowadays without eslint + prettier. So again with dev dependencies:

npm install --save-dev babel-eslint eslint eslint-config-node eslint-config-prettier eslint-plugin-prettier babel-loader babel-polyfill

And again the configuration file (.eslintrc) was something like that, after some specific changes for this project:

{\n  \"extends\": [\"node\", \"prettier\"],\n  \"parser\": \"babel-eslint\",\n  \"parserOptions\": {\n    \"ecmaVersion\": 8,\n    \"ecmaFeatures\": {\n      \"experimentalObjectRestSpread\": true,\n      \"impliedStrict\": true,\n      \"classes\": true\n    }\n  },\n  \"env\": {\n    \"es6\": true,\n    \"browser\": false,\n    \"jasmine\": true,\n    \"node\": true,\n    \"commonjs\": false,\n    \"jest\": true\n  },\n  \"rules\": {\n    \"no-unused-vars\": [\n      1,\n      {\n        \"ignoreRestSiblings\": true,\n        \"argsIgnorePattern\": \"^ignore\",\n        \"varsIgnorePattern\": \"^ignore\",\n        \"caughtErrorsIgnorePattern\": \"^ignore\"\n      }\n    ],\n    \"arrow-body-style\": [2, \"as-needed\"],\n    \"no-param-reassign\": [\n      2,\n      {\n        \"props\": false\n      }\n    ],\n    \"no-console\": 0,\n    \"import\": 0,\n    \"func-names\": 0,\n    \"space-before-function-paren\": 0,\n    \"max-len\": 0,\n    \"no_underscore-dangle\": 0,\n    \"consistent-return\": 0,\n    \"comma-dangle\": 0,\n    \"import/prefer-default-export\": 0,\n    \"array-bracket-spacing\": 0,\n    \"space-in-parens\": 0,\n    \"prefer-arrow-callback\": 0,\n    \"no-plusplus\": 0,\n    \"no-use-before-define\": 0,\n    \"global-require\": 1,\n    \"import/no-commonjs\": 0,\n    \"import/no-extraneous-dependencies\": [\n      \"error\",\n      {\n        \"devDependencies\": true\n      }\n    ],\n    \"no-process-exit\": 0\n  },\n  \"plugins\": [\"prettier\"]\n}

Libraries to use and package setup npm build

Then we needed to be able to use babel transformation process to build the ./src, and connect it in the bin script.

{\n  // ...\n  \"scripts\": {\n    \"build\": \"babel src --out-dir dist\",\n    \"test\": \"jest --watchAll\"\n  },\n  // ...\n  \"bin\": {\n    \"wappalyzer-to-md\": \"./dist/cli.js\"\n  },\n  // ...\n}

With the previous configuration, we are able to execute the babel compiled sources. And we can update them each time we build the project.

So let's create also our first file which will be our start point of the script /src/cli.js:

console.log('-- Starting Execution --');\nconst [, , url] = process.argv;\n\n(async () => {\n  try {\n    // 1.- We need to validate params\n    // 2.- Make the call to the sever side to check\n    // 3.- Transform it to markdown\n    // 4.- Copy it to the clipboard\n\n    console.log(' -- 📋 Markdown Copied 📋 -- ');\n  } catch (e) {\n    console.error(' --💥 Something when wrong 💥-- ');\n    console.error(e);\n  } finally {\n    process.exit(0);\n  }\n})();

We are not only creating the file but defining the \"script workflow\" with it splitting it to be able to work with tests in the correct way 💁‍.

Executing the project with npm link

npm link it's a great way to test and use npm modules before registering them.

To execute the previous example we just need to execute in the console in our project folder.

npm link

Then we are able to execute it with:

npx wappalyzer-to-md

And get the console output in the console.

-- Starting Execution --\n-- 📋 Markdown Copied 📋 --

Jest setup npm test

Let's just add the uni test configuration to be able to implement each part of the workflow described previously with unit test. For it let's install jest configuration

npm install --save-dev jest babel-jest

And having the jest --watchAll in the test script made me able to execute npm test

I got these issues: ReferenceError: regeneratorRuntime is not defined described here and I got it resolved by specifying the target for babel in the .babelrc.

{\n  \"presets\": [\n    [\n      \"@babel/preset-env\", {\n        \"targets\": {\n          \"node\": \"current\"\n        }\n      }\n    ]\n  ]\n}

Then I was able to start coding with npm test running as usual with any js project.

Implementing the plan

For the implementation, we need only 3 libraries the two already described wappalyzer and clipboardy and the indispensable lodash one.

npm install lodash clipboardy wappalyzer

You have the full project available in my Github account to check it, use it, adapt or improve it.

Basically, I created the following folder structure for each of the steps described in the cli.js backbone:

\n
• validation: To have params validations, as in the cli the inputs are coming from the call args.
\n
• data: To wrap the logic of using the Wappalyzer npm module and test it.
\n
• logic: for me, the logic in this program was to transfer the Json output from Wappalyzer to the \"standard\" markdown I was trying to create. Pretty straight and quite exciting to create in an elegant way 🤓
\n
• output: in the script, we haven't viewed, but we do have output logic, so again I decided to isolate the clipboardy logic and wrap in the logic folder.
\n

These are the main parts of the small script project, I think the best way to know how each part works, as I think we should always do, it's just to read the specs test on each folder to then understand then easy cli.js file which orchestrates the script pieces.

Additionally, to execute before register the script project, we should npm link the project an execute it again now with valid params like:

npx wappalyzer-to-md https://robertovg.com

And we will have in the clipboard a markdown document with what we wanted to extract 🥳.

Register in npmjs.com to be widely used 🤔.

So last step was to register to npm, so we can use it without the sources, that's pretty sexy approach and honestly the first time I think to register on npm something which is not created to be used as node module but as npm script.

Pretty simple, this is done by npm publish as always and first, you need to set up an account in npmjs.com and log to npm through npm login call.

Then the package it's available for anyone calling

npx wappalyzer-to-md <url>

And listed publicly in npm register.

Conclusion

Nothing crazy here, but funny for me to use my web toolset to make a script. I will try to use this approach when I see the opportunity in the future if I need to resolve scripting challenges again.

Have you ever use npm script in this way? Do you see improvements in the way I use it? Or maybe do you have any doubt? I'm always happy to learn from any feedback and hopefully, this can be useful not just for me but for anyone facing problems which could be resolved by npm scripts.

I hope you enjoy reading 🤗.

Intro

I'm a frictionless guy, developer mainly because I enjoy the process of creation of new applications and I like to use them and enjoy with the process, trying to avoid as much as I can the time I spend on manual deployments configuration process. Basically I Prefer to spend this time doing than resolving config problems.

React Native (RN) is a game-changing technology in the mobile development world, a lot of magic is happening in the background in order to transform the React code to native code transparently.

But using RN without Expo, makes you have to deal with Xcode, Android Studio to generate the packages and deploy your application to the Play and App Store, and this means to have to deal with more configuration dependent to 2 completely different platforms cocoapods and swift for iOS and gradle and Java for Android.

That's why the existence of Expo makes sense.

Why Expo is so needed when working with RN

I have to say the default output from create-react-native-app produces a React Native + Expo project, so we don't have to do anything special to have Expo up and running.

The reasons why for me setting the project up with expo makes sense are described in the following points:

\n
• Resolve the testing scaffolding.
\n
• Allow you to execute and play with the application on real devices without having to set up your devices as development devices
\n
• Generate .ipa (iOS App Store Package) and .apk (Android PacKage) to deploying to App Stores through their server without having to deal with XCode (which makes mandatory to have a Mac computer) and JDK.
\n
• Sugar additions like tunnel deployment (allowing devices out of your Network to try your application during development ).
\n
• A tool to open the emulators through the CLI or the browser with just one click.
\n
• And offering their own SDK to deal with specific device possibilities in a transparent way.
\n

And the best thing as I said before, the configuration comes resolved out of the box with create-react-native-app

Our First Authentication Solution

At Precursive, when we started to use Apex Rest API within our React Native application we also needed to resolve the authentication from a different way than any other application we made inside the Salesforce development.

I try to give a try to follow the official documentation, and in the case of Salesforce was using the Salesforce Mobile SDK with forcereact create as is described in their trailhead

This react-native-force module provides 4 packages with useful Salesforce utilities 'import {oauth, network, smartstore, smartsync} from 'react-native-force'; and we can use oauth.authenticate to Login to Salesforce, but this project is not using expo.

\n

In summary; Good and frictionless solution but because it generates the project with react-native-force and it doesn't use expo. It generates dependent iOS and Android code with the forceios and forceandroid native modules.

\n

Other O Auth2 with RN

Salesforce provides Authenticate Apps with OAuth\n so OAuth looks like the standard to use for authentication.

So I checked the different RN libraries out there to resolve this O Auth.

\n
• OAuth login for React Native. This one provides easy setup for this social networks (Google, Facebook, Twitter and Tumblr).
\n
• react-native-oauth provides an interface to OAuth 1.0 and OAuth 2.0 providers with support for the following providers for React Native apps (Twitter, Facebook, Google, Github, and Slack)
\n
• React Native App Auth React native bridge for AppAuth - an SDK for communicating with OAuth2 providers, this is the one which looks more standard, in my opinion,.
\n

But all of them uses native modules and Expo doesn't currently support them, meaning we need to eject the application to install those libraries, and this means no expo in the project 😢.

Our solution to don't leave Expo

So before accepting the fact that OAuth libraries are not compatible with Expo, I checked the Expo SDK and I found something which we could use to resolve our problems AuthSession.

This package is already included in Expo, so basically we just need to use it to make the login.

So here a quick simple SignInScreen component showing how to log in to Salesforce using Expo Auth-session (of course we also need to have connected application set up correctly following SF instructions).

import React, { Component } from 'react';\nimport { SF_OAUTH_URL, REMOTE_ACCESS_CONSUMER_KEY } from 'react-native-dotenv';\nimport { AsyncStorage, Button, View, Text } from 'react-native';\nimport { AuthSession } from 'expo';\nimport { globalStyles } from '../constants/Styles';\nimport ScreenKeys from '../constants/ScreenKeys';\n\nexport default class SignInScreen extends Component {\n  static navigationOptions = {\n    title: 'Please sign in',\n  };\n\n  state = {\n    errorCode: null,\n  };\n\n  _signInAsync = async () => {\n    const { navigation } = this.props;\n    const redirectUrl = AuthSession.getRedirectUrl();\n    const result = await AuthSession.startAsync({\n      authUrl:\n        `${SF_OAUTH_URL}` +\n        `?response_type=token` +\n        `&client_id=${REMOTE_ACCESS_CONSUMER_KEY}` +\n        `&prompt=login` +\n        `&redirect_uri=${encodeURIComponent(redirectUrl)}`,\n    });\n    console.log(result);\n    const { type, errorCode = 'You cancel or dismissed the login' } = result;\n    if (type === 'success') {\n      // Just simple way to store the token in this examples\n      await AsyncStorage.setItem('userToken', JSON.stringify(result));\n      navigation.navigate(ScreenKeys.main);\n    } else {\n      /**\n       * Result types can be: cancel, dismissed or error (with errorCode)\n       */\n      this.setState({ errorCode });\n    }\n  };\n\n  render() {\n    const { errorCode } = this.state;\n    return (\n      <View style={globalStyles.container}>\n        <Button title=\"Sign in!\" onPress={this._signInAsync} />\n        {errorCode ? <Text>{errorCode}</Text> : null}\n      </View>\n    );\n  }\n}

\n

With this steps, we can login to Salesforce orgs through RN application and then use Apex Rest API and work with Salesforce servers as any other standard Rest server, making our development work as standard and frictionless as possibles keeping Expo 🚀.

\n

Intro

When I started to use Functional Programming (FP) in my code, I also started thinking in a different way. When something is finished and working, I constantly ask my self, \"Could I get the same results, with a more elegant code?\". Of course, I've been always refactoring my code, but since I'm in the FP influence, this feeling of chasing purity, simplicity, and proudness when coding is far more relevant.

As it said in the official documentation: \"A HOC is a function that takes a component and returns a new component\", obviously they do something in this process, usually they add some properties to the target component by the execution of some extra logic, allow them to reuse the code which the HOC contains.

This article pretends to be a rough introduction and reference to anyone interested, not only on understanding what they are but also to share my experience with High Order Components (HOC) in real-world examples.

When we use HOCs

I've been using HOCs with React from the very beginning without notice, simple examples could be found when you start integrating common in third-party to your code, like Redux or graphql.

I will paste a piece of code where I use graphql with Apollo to query and fetch user data from the session and a basic logic of a simple authentication code.

import React from 'react';\nimport PropTypes from 'prop-types';\n// eslint-disable-next-line\nimport { Meteor } from 'meteor/meteor';\nimport gql from 'graphql-tag';\nimport { graphql, withApollo } from 'react-apollo';\n\nimport LoggedApp from './LoggedApp';\nimport Logging from './Logging';\n\nconst App = props => {\n  const { data, client } = props;\n  // Skipping the execution if data is not loaded\n  if (data.loading) return null;\n  // We show the LoggedApp  or Logging one depending if the user is logged\n  return data.user._id ? <LoggedApp {...props} /> : <Logging client={client} />;\n};\n\nconst userQuery = gql`\n  query User {\n    user {\n      _id\n      alias\n    }\n    users {\n      _id\n      alias\n    }\n  }\n`;\n\nexport default graphql(userQuery)(withApollo(App));

Here instead of exporting the App component directly to be used in other parts of our app, we use 2 HOCs, one to inject a graphql query and another to inject Apollo to manage the queries. So no one but 2 HOCs used in this simple example.

More details of how to use Apollo in your apps in their official docs.

As a really high-level summary, we could say that HOCs return our components adding them some special properties, abstracting you from the logic contained in the HOC.

Example Project Context

So after understanding the benefits HOCs can bring to your code, I'm using them in my code when I see a good opportunity. And here I'll try to explain a clear situation where we used.

In Precursive we use React + Design System React\n (a library we are using to render our Lightning Scheduling Page). This library is React implementation of Lightning and because it can be used in different environments, we need to specify were we to find the icons assets (SVGs).

We do this configuration with the Icons Settings, a component, this component is used as a wrapper on your root component and all nested components will use to know where to find the icons assets.

// imports...\n\nconst sagaMiddleware = createSagaMiddleware();\n\n// Creating enhancers to connect our middleware (saga and asyncDispatchMiddleware)\n// and adding devtools in elegant way\nconst enhancer = composeWithDevTools(applyMiddleware(sagaMiddleware));\n\nconst store = createStore(reducers, {}, enhancer);\n\n// We load the configuration of the icons differently depending if we have\n// or not the local environment icons available from _slds\nconst IconConfiguration =\n  process.env.NODE_ENV === 'development' ? (\n    // eslint-disable-next-line\n    const actionSprite = require('@salesforce-ux/icons/dist/salesforce-lightning-design-system-icons/action-sprite/svg/symbols.svg');\n    // eslint-disable-next-line\n    const customSprite = require('@salesforce-ux/icons/dist/salesforce-lightning-design-system-icons/custom-sprite/svg/symbols.svg');\n    // eslint-disable-next-line\n    const doctypeSprite = require('@salesforce-ux/icons/dist/salesforce-lightning-design-system-icons/doctype-sprite/svg/symbols.svg');\n    // eslint-disable-next-line\n    const standardSprite = require('@salesforce-ux/icons/dist/salesforce-lightning-design-system-icons/standard-sprite/svg/symbols.svg');\n    // eslint-disable-next-line\n    const utilitySprite = require('@salesforce-ux/icons/dist/salesforce-lightning-design-system-icons/utility-sprite/svg/symbols.svg');\n    <IconSettings\n      actionSprite={actionSprite}\n      customSprite={customSprite}\n      doctypeSprite={doctypeSprite}\n      standardSprite={standardSprite}\n      utilitySprite={utilitySprite}\n    >\n      <App />\n    </IconSettings>\n  ) : (\n    <IconSettings iconPath=\"/_slds/icons\">\n      <App />\n    </IconSettings>\n  );\n\nsagaMiddleware.run(rootSaga);\nrender(<Provider store={store}>{IconConfiguration}</Provider>, document.getElementById('app'));

So basically as you can see, depending on the environment we load the SVG through requires or relay to Salesforce assets when the application is deployed in Salesforce (Why to load the icons into our static resources if they are already loaded in Lightning Experience).

\n

Notice I'm using require inside the if statement, in this way I only fetch those SVGs when I'm on the development environment and avoid to include them in the package to be deployed.

\n

Problem to resolve

This previous code works, but we have 2 issues with it.

\n
• First, we have code which could be isolated about this Icon configuration which is completely independent of the initialization of our application.
\n
• Secondly, if we want to use this piece of code in different parts of our applications (having other root components to mount)...well then we have to copy and paste the code, and this is never an option.
\n

Solution with HOC

So why not use a HOC to isolate the logic around the creation of this IconSettings component, sound like a good use case, don't you think?

Actually, the solution with HOCs is the only tool we have to return a new component wrapped into the IconSettings one (which need to be set up as a wrapper)

So I created a new component called iconifyComponent with this code.

import React from 'react';\n\nimport { IconSettings } from '@salesforce/design-system-react';\n\n/**\n * HOC to wrap the IconSettings logic and reuse when need to be reused (on salesforce environment)\n * We load the configuration of the icons differently depending if we have\n * or not the local environment icons available from _slds\n */\nexport function iconifyComponent(WrappedComponent) {\n  return function WrappingComponent(props) {\n    if (process.env.NODE_ENV === 'development') {\n      // eslint-disable-next-line\n      const actionSprite = require('@salesforce-ux/icons/dist/salesforce-lightning-design-system-icons/action-sprite/svg/symbols.svg');\n      // eslint-disable-next-line\n      const customSprite = require('@salesforce-ux/icons/dist/salesforce-lightning-design-system-icons/custom-sprite/svg/symbols.svg');\n      // eslint-disable-next-line\n      const doctypeSprite = require('@salesforce-ux/icons/dist/salesforce-lightning-design-system-icons/doctype-sprite/svg/symbols.svg');\n      // eslint-disable-next-line\n      const standardSprite = require('@salesforce-ux/icons/dist/salesforce-lightning-design-system-icons/standard-sprite/svg/symbols.svg');\n      // eslint-disable-next-line\n      const utilitySprite = require('@salesforce-ux/icons/dist/salesforce-lightning-design-system-icons/utility-sprite/svg/symbols.svg');\n      return (\n        <IconSettings\n          actionSprite={actionSprite}\n          customSprite={customSprite}\n          doctypeSprite={doctypeSprite}\n          standardSprite={standardSprite}\n          utilitySprite={utilitySprite}\n        >\n          <WrappedComponent {...props} />\n        </IconSettings>\n      );\n    }\n    return (\n      <IconSettings iconPath=\"/_slds/icons\">\n        <WrappedComponent {...props} />\n      </IconSettings>\n    );\n  };\n}

Now in our entry point, we can just use the HOC to abstract of the icon configuration and make it super nice, elegant and clear.

Using the created iconifyComponent in our entry point (index.js) we got something like that:

// more imports...\nimport { iconifyComponent } from './data/iconifyComponent';\n\nconst sagaMiddleware = createSagaMiddleware();\n\n// Creating enhancers to connect our middleware (saga and asyncDispatchMiddleware)\n// and adding devtools in elegant way\nconst enhancer = composeWithDevTools(applyMiddleware(sagaMiddleware));\n\nconst store = createStore(reducers, {}, enhancer);\nconst AppIconized = iconifyComponent(App);\n\nsagaMiddleware.run(rootSaga);\nconst AppIconized = iconifyComponent(App);\nrender(\n  <Provider store={store}>\n    <AppIconized />\n  </Provider>,\n  document.getElementById('app')\n);

🤩 Pretty sexy, don't you think? If now, we need to use the same icon configuration in any other part of our application (if there is another root application), we can just use the HOC again and forget about the details.

Conclusion

Well as everything in life, we should not abuse of the usage of HOCs in our code, and try to write them when it makes sense, but in the other hand is a pretty elegant solution we have available in our tools within React environments.

Well, tell me what you think about this use case and about the use of HOCs in your code.

See you soon!

The importance of side skills

This 2018, I'm spending my learning time on React Native (RN) as side skill\" for me. As general rule, I enjoy to have always something else than what I have to use at work, in my learning queue (not having all my eggs in the same basket), and usually it's funny how this new skills not needed at when I started learning it, become something useful far sooner than later (already experience it with Wordpress, Angular , es6, functional programming, static web generators like Jekyll, Grav, Gatsby and more.

I've been focused on React for more than a year ago at Precursive, so when I heard about React Native and how it was supposed to produce real native iOS and android applications reusing all my javaScripts toolset, it was an opportunity I didn't want to miss. Honestly I tried little examples of it more than a year ago, because I thought this was going to be a technology similar to Cordoba, where you do execute the javaScript you code by and embed browser resulting into a slower end application than a real native one, but this was not the case at all with RN and I had had the time, I would love to had focus on it sooner, but well is always better later than never.

Where to learn new technologies

I know each developer is completely different in terms of how we consume learning material, we can learn from others code, going to classes, reading books, just reading breathly the documentation and by using the technology, listening to Podcasts or watching video tutorials. In my case, the faster/easier way is to consume good video tutorials. Even though, I use to go to the official documentation and guides from official sources.

So, if I see high-quality courses, normally from Tuts+, Frontend Masters, Wes Boss, or like, in this case, Level Up Tutorials, I just go for it. Basically because is the faster way I know to transfer the skills you need to use this technology to your brain, and completely processed for you to just get the right way of how to use this library/framework to do real things.

With RN, I started with the first Level Up Tutorials about it called React Native For Everyone, it was very useful and I started to write pet applications just for fun and to explore the capacities of it. You really finish it producing a real native application.

Then he released this fabulous course, this time like a continuation but adding graphql to it, and focusing on graphcool database (graphql with apollo). At that time I already had previous experience with meteor and grahpql so was a good way to improve on this stack also. Like always, I do all the exercises suggested and explained on courses, but with the output I knew, even when it was a great functional \"Journal\" application, that (as far I understood), some parts were missing to use this as code base in my projects.

So I thought it was a good idea to start with this Level 2 React Native With Graphql resulted project and iterate over it to incorporate the following improvements. I called it Journal Updated and published to github (where more and more I'm trying to have a side projects public code portfolio).

Improvements to Journal

All these points are also on the Github project Readme but I'll explain them a little bit. (Not following the same structure to explain the points)

1) Adding .eslintrc and .babelrc with my rules to the project and fixing the code accordingly

Well, call me lazy, but I need to have then linting and the prettier set up correctly in any project. I'm used to doing it when I'm working in a team, so we follow the same code styles, and I found it very useful even working in a project as the only developer.

Then I had to make a lot of changes to the resulting code, translating stateless components to pure function, adding PropTypes to props, avoiding duplicated code, removing unused import, refactoring components...

Of course babel now days is a must for any web developer if you want to write good code before is supported by all browsers and platforms (more about it in my previous post)

There I faced some issues with Babel and env-0 resolved by using react-native-stage-0 preset instead of the default stage-0.

2) Having the possibility to have properties files

Moving the graphcool URL to an external configurable properties file so we could have different values depending on the environment and we don't hardcoded endpoints in our components. Resolved with react-native-dotenv.

Any real application needs to have an easy to access places where our configurable properties live, so it's easier to make changes without having to dig in the code.

3) Updating react-navigation to goBack issue

The problem which made me investigate about goBack issues with the 1.x react-navigation was one I found after updating the Post title. After saving it, we back to the Post Component with the old title instead of the updated one.

The issue was caused because after successfully updating the title, on the callback of UpdatePost, we called navigation.goBack() to return to PostElement where we load the title, not by the query itself but by the params passed from the Posts like that:

  static navigationOptions = ({ navigation }) => ({\n    title: navigation.state.params.title,\n    ...navStyles,\n  });

And the issue was goBack has no possibility to send a new state to update the params, so I thought to use navigation.navigate again so I can pass the update title to the PostElement component and the title is shown correctly updated. But then the problem was we where adding new items to the navigation queue, so we were not actually returning to the previous page, but going to the new one, so if you then click back on your phone, you return to the old state of the form to update the form... which is not what we want.

Thankfully with the react-navigation-2.0-rc the added a new smarter behavior to navigate) I think to avoid this problem, and if you navigate to a page which already exists, it reflected as if we returned back to the previous View (with the updated state)... Exactly what we want!

Then actually I thought to update all the libraries in the same go, so I moved all the libraries versions to the last stable version so we keep the code base up-to-date.

4) Errors aware

After the course, any API call susceptible to raise an exception was treated only with a console.log in the catch section. And this is fine to understand the usage of graphql and the mutations but in a real-world example, you really want to do something else, like informing the user of the error which is happening.

So I start treating the possible problems which we could get in any api call by raising the exceptions with an explication to the user information of what's going on makes sense in my opinion.

In the parent component UserForm for the login and PostForm for the updates on Posts, I was dealing those exceptions and showing to the user with Alerts from React Native.

Additionally, I added real validations to the login, so we are not able to Create a user or Login with empty email/password and things like or invalid emails or password, here the simple validations used:

isEmailValid = () => !!this.state.email.match(/@/);\nisPasswordValid = () => this.state.password.length > 5;

The email should contain @ and the password to contain at least 5 characters. If these conditions are not true, then submit form button is disabled and we inform with the property success property on each Item form elements (email and password)

So now everything is a bit more error proof and in real applications, we always need to be prepared for any unexpected situation like an exception from an external call or input errors from the user.

5) Moving to es6 new async/await syntax

It's difficult to explain all the changes I made around this topic but this is also very important, for example, to continue with the treatment of exceptions for me was far more clear to use async / await instead of try catches.

There is a generic UserForm component with the form validations for email and password but also with the high-level treatment of the specific form actions (one for LoginUser and CreateUser).

The body of this method looks like:

submitForm = () => {\n  const { email, password } = this.state;\n  this.props\n    .onSubmit({\n      email,\n      password,\n    })\n    .catch((error = {}) => {\n      const { message } = error;\n      Alert.alert(\n        message,\n        undefined,\n        [\n          {\n            text: 'Try Again',\n          },\n        ],\n        {\n          cancelable: false,\n        }\n      );\n    });\n};

Then the methods passed as onSubmit params are async methods and they rise the specific exceptions with makes this catch section to be executed, this is the onSubmit method for the create user one.

createUser = async ({ email, password }) => {\n  const { createUser, signinUser, client } = this.props;\n  try {\n    await createUser({\n      variables: {\n        email,\n        password,\n      },\n    });\n    const signin = await signinUser({\n      variables: {\n        email,\n        password,\n      },\n    });\n    signIn(signin.data.signinUser.token);\n    client.resetStore();\n  } catch (error) {\n    console.error(error);\n    // I know, very hard assumption...\n    // but just to don't omit the exception and show to the user\n    throw Error('Username already used');\n  }\n};

In this way, we code like if there is no exception but with the try, we are save from unexpected situations.

6) Change color of indicators form iPhone ( network, time, etc)

This is a bit simple fix, but this because of the color of the header had the network, time, battery indicators from the iPhone black and the header has a dark color, was difficult to read.

But in a very convenient way there is an easy fix for this: We can pass a property called headerTitleStyle which we can use for navigationOptions of our view components and add a white color to it, so we have the proper contrast between the iPhone indicators and the background of the header.

7) Allowing the user to hide the keyboard

Well for me this was new UX improvement, when we show the keyboard when clicking on the text area it doesn't hide any possible way, I had to select the input text of the PostForm to click on enter and hide it. But this was not very nice.

So I found a way to hide the keyboard when just clicking out of the text area, . Instead of using a View we can display the content in a ScrollView, this component have a property called keyboardShouldPersistTaps which, if we set to false, the form does exactly what we wanted it to do.

8) Facing problems with Expo

But well, there is not only good things, I was blocked by expo long time just because for example was not able to recognize the new version of the application after serious changes, so to solve it I renamed the application and then it started to work, somehow expo CDN was not updating the old version in some point, so if you deploy and unstable version of your app and then you fixed and don't see the new version after updating it from expo, maybe try with a application name change.

Actually, I faced one issue (Nested React Native projects result in TypeError: undefined is not an object (evaluating self.fetch)) published in react-native official GitHub and when it was resolved was still not able to update the deployed expo version.

9) Expo improvements

When we deploy the application con Expo, we show the icon of expo while the first loading process is happening and this is not what we want if we write our own application. Expo makes super easy to have our own first screen and logos updated with our brand, we only have to create folder in the root of our application called assets and inside create two files, icon.png and splash.png with the application icon and application first screen.

I always follow warning console messages as soon as possible, I found that when you create projects with Expo XDE.app it was creating the application with his own version of React Native (https://github.com/expo/react-native/archive/sdk-27.0.1.tar.gz) and changing it actually stop a warning to appear about this, so I just start using this Expo version of React Native instead.

10) Other Cosmetic improvements

I don't pretend to cover all little changes I made, but I improve some problems with the edition of the form when using smaller phones, centered the loading (always shown in a View section) and showing it always when an async update action was happening...

End of Part 1

Well, of course, this is not all that I wanted to finish, my TODO list for this project in this specific moment is not finish, but I think there is already enough information to be split into more than one part.

\n

The header image was taken from the course React 2 Native from Scott Tolinski

\n

\n

As with this article, I started to share code, I added to the blog the gatsby-remark-prismjs\n to highlight code syntax, and after some small styles improvements to be ready for mobile, the experience has been fantastic, 100% recommendable.

\n

Why I love js

One of the reasons why I'm so passionate about javaScript, since I meet it in my early years during my degrees studies, is how much is always changing and evolving.

I know this forces you to spend extra effort to be on the top of the technology. Basically, I like to think about it as a continuous student status we have to maintain. Web/Applications technologies and are evolving continually and you have to keep learning or at least listen what is going on. For me is not a concern but more a way to keep my work environment challenging and interesting, but if you don't like this situation of never being able to stop this continuous evolution, well I think javaScript is not your territory.

When you master a technology, starts to be obsolete

As soon as you think you master a technology usually it starts to be obsolete, I remember at work four years ago, we start \"Precursive v1\" with Angular, we build a great product, we really mastered everything around Angular, grunt ( then moved to gulp ), lodash... but, we omitted the Angular 2.0 release, well first we checked that moving our code to this major version was not straight at all, we had to refactor a lot of code just to use it, also we wrongly thought, as Google announced they will maintain 1.X branch, we don't really need to migrate... Right now, I look to this decision and I have to regret my call.

Angular 1.X is still maintained, updated and it works but has a death date written and is out of the market, so simple, if you don't agree with this I'm sure you are also out of the market. We continued writing code in a dead technology, and because of that, we have actually been at least 2 years below what was going on with the javaScript world. And this the best way to miss the \"feel of being in the cute edge\", maybe you will miss new features from the new versions of the new frameworks, libraries, maybe productive incorporations to the language, the toolset improvements...

Happily, for us, we are reacted and start using React, Lightning and as much new addition on ES6 to write as modern and functional code possible.

Functional Code is here and will stay

One thing is to feel dependencies to concrete technologies, which we should not, but another thing is to learn and try to play with different code styles which can help with the concreteness, robustness, and readability of our code, and this is what is provided by Functional Programming.

It is hard at the beginning, especially when you work in a team and not everyone is not at the same level on the FP learning process, but usually reading others codes code helps to force everyone to make the move to FP, even though I highly recommend some courses or start material for beginners.

With the time, and applying those good principles the code improve a lot, so is win-win to adopt all early javaScript features which help to move in this direction.

Try to write as agnostic code as possible

Additionally I feel with React and Vue, the code is not so dependent to third-party libraries as before, especially with Angular you trust on their engine to update values you add to the inputs of a form or to the text you show to the user, double binding and their rigid architecture (Controllers, Factories, Services, Directives, Filters...).

Right now I try to resolve with native ES6 things I would rather resolve with, for example, lodash, there is a great Github repo for that, but of course not always it is possible. Even though just to be conscious about it, makes your code better.

I've been with my focus on React for more than a year ago, and I'm in love with everything which it has incorporated into my code style. Well, I've been also making a big jump to FP consciously, I feel this is the right way to write code nowdays.

Even try to write future technology code

So basically, and because of the heavy incorporation of ES6 and all edge javaScript features included in the language I feel I write more functional, simpler, reusable, concrete and easy to be read and be test code, now I use to show my team solutions to concrete problems resolved to share the knowledge but honestly because I'm proud of it enough to show it more.

Babel with the proper presets (stage0 and env) is a must on any new project nowdays, have the possibility of trying language syntax improvements even before they are implemented on browsers or node is something we should not miss. I love how Babel explain what it does to Babel, Use next-generation JavaScript, today., just it.

Native applications

Well, of course, this is what I'm right now learning and applying, React Native, really offers a powerful tool for frontend developers.

So no doubts this is something which really makes us ask if we really need to maintain two versions of the same application with different code base ( one for iOS and one for Android ) when we could just write a proper React Native project instead.

I would like to write a new article about it this fall.

Final thoughts

I love this JavaScript is great! JavaScript is a mess! the initiative and I wanted to use as excuse/reference to start this article. I think it helps to understand if you missed something year by year or where the market is moving objectively.

So in my opinion, Functional Programming is something to really deep learn and integrate into our code, we have to not feel a technology as the keystone or the definite technology. Learn about it, prepare your self to use and enjoy the process as much as you can, but as soon as you feel you mastered it, start putting your sight on what's going on, what has appeared and prepared to release your current stack, because sooner than letter you have to jump to the next one again.

I've been working remotely more than 4 years already, and at least 3 of them I've been working from our own office.

The Internet has been always a priority for me, especially since May we opened our own Coworking Space called Corker Space.

I always worried about having a good Internet connection, but when you work in an office with more digital co-workers you realize, the Internet coming from your ISP is important, but how you manage your internal network is even more relevant and is there where I found more problems.

By the way, the first point, our ISP, is resolved in CorkerSpace by a local company called RedJam. They provide a very stable 200Mb/s symmetric connection, and so far, we haven't detected concerns from their connection.

As I previously commented, the second point is actually the one I really found challenging, I'll briefly explain the changes I made in our network and which issues we found with each of the routers and configurations until we found the really solid solution we have right now.

\n

This hasn't got the intention of being a professional review of the devices we have been using, but just a way to share our experience a and maybe help someone with it.

\n

Initial setup - Huway HG8245H

Well this was the router provided by the company, the problem we found with this one and the reason we change it doesn't provide a 5Ghz connection, and I wanted to be able to really get more speed from our provider, and the wifi bandwidth was the problem in this case, as 2.4Ghz network is not able to transmit more than 20-30Mb/s.

Improving Router - ASUS RT-AC1200G

Well, this was our first investment, we made it just after some weeks in the office as Coworking, and it really was a big change, we start being able to get more than 150Mb/s in the speed test and with 2 or three users in the space, we experience no problems, just a big improvement with the previous setup.

The trick here was because of the new 5Ghz network the router was able to create, which by definition is able to perform faster connections.

The problem started when more people and devices were added to the network ( printers, casting devices, scanners, and more PC and laptops ), at this moment, with maybe 20 clients, randomly some people started to disconnect from the network and were very tricky to understand the reason.

Additionally, the fact of having 2 networks \"CorkerSpace\" (2,4Ghz) and \"CorkerSpace_5G\" (5Ghz) was also not obvious, at least not for people not familiarized with networks technology.

In Corker Space, we have two 85m2 offices and I thought the issue was because of the distance from the people from the second office, so this leads me to the next addition to the network.

Adding an extensor - TP-LINK RE355

Well, this is a very simple addition and most of the people know these kind elements. They are able to get the original network signal and create a twin one. So I place it in the optimal location in the second office, just in the middle of the two offices. And things started to get worse and worse.

Know I understand everything a bit better, but if the original router already had problems with the number of devices to manage, adding a repeater which basically doubles the communication of the devices connected to the repeater, made things worse.

Improving the main router - Linksys WRT3200ACM-EU

So again I read about best routers, and I thought let's try something more powerful which is able to avoid this problem managing all our clients.

So this router is a beast especially comparing the specifications from the Asus one, Tri-Stream instead of two networks stream, 1,8 GHz CPU instead of 800 MHz and 512 MB than the 256MB.

But the people connected through the repeater had problems, pages loading very slowly, problems trying to connect during the mornings, pages looking like offline when they where correctly resolved after resetting the router, so somehow something was not working, and of course it was not so bad, but digital worker know internet is a must when working, so I had to do something.

Changing to a Ubiquiti mesh system - Amplifi

I read about Mesh systems time ago and was something I wanted to try, the idea made sense, create a modular network system which is prepared from the beginning to add new nodes to the network, so those \"repeaters\" are smarter ( aware of any other point added ) and they don't cause saturations problems like usual repeaters do.

Additionally, a friend of mine told me time ago about Ubiquiti, this is not maybe the faster solution ( looking to the speed test results ), and maybe people say there are betters solutions, more sophisticated...

But the experience changed completely in the office from the day I disconnected all the other network devices and I added just an Amplifi HD home wi-fi router in the main office and one\nAmpliFi HD Mesh Point in the twin office.

Basically now we have just one network, the system manages where you should connect, also the network you should use (5Ghz or 2,4Ghz) and the cool thing is 100% transparent, there is just one CorkerSpace network and all is simple.

We spent already almost a month with this setup and even with more than 40 concurrent devices we had no problems, is incredible.

And well just to finish talking about the Amplify, the design of the application and the router itself is amazing, yes, the post image is the Main router.

Maybe there are better solutions but as someone who is not networking professional, I just wanted exactly what I have now in the our space, something which is transparent (nothing to manage or to configure), beautiful (we don't hide the router anymore) and which just really works.

Has been a long time without updates on my site, and it wasn't because I had nothing to share, but maybe because I was more focused on doing than on writing about what I was doing.

Anyway, I used (again) the excuse of try a new technology to update this site, and learn in the process.

This is the third time I'm moving the site from one technology to another, but I think this time was a good move, when I first move from Wordpress to Github pages with Jekyll I did, because I thought, I don't need a database or admin panel, as I prefer to have a light environment and easy to customize, and Jekyll was a good option for that. The problem was the background technology, Jekyll is built with Ruby and the template engine used is liquid, and even when is easy and powerful to use is out of my scope as frontend. So I don't feel it like a natural way to code templates.

I've been always very into flat files CMS since I met Jekyll. I strongly believe you should avoid databases if possible to render public webpages than have to deal with caches and side problems of databases (unless you have the resources to deal with proper database administration) but is truth is piece of your architecture which needs to be properly resolved and managed if you want to do it well, and you need the knowledge and the time to invest in it, and flat files CMS give you quick performance and load times out of the box, and in most of cases (for usual webpages) is valid solution.

For example, for our coworking space (CorkerSpace) I used Grav, it has a lot of advantages if you compare it with Jekyll, for example, it has a very powerful administration panel, so the admins of the space can introduce changes without me having to deal with those changes, but the integration with git comes with a plugin which is a bit limited. In Precursive is build with Statamic and still is PHP but is a truth that has a better admin console (with the cost of its license).

So I don't build websites as my main job, but I enjoy it as frontend so I like the idea of don't need to change my stack when I have to publish a site.

Then since I moved to React, I found it so easy to build any kind of application; mobile, desktop, big projects, small PoC... and when I hear about Gatsby I was shocked.

\n

\"A CMS, easy to deploy, static, with great services and plugins around and based on serverside React rendering components and using Graphql to consume your data ( which could be images and posts from local files and even integrations with any imaginable service out there...)!\"

\n

I really was so excited, it means I have all the used and loved tools I choose to build applications available to build webpages and having a resulting product (webpage) far faster than any other CMS could even imagine... and here I am again 🤓.

During the process is true you don't have so many fancy themes like with more matures solutions (Wordpress is the king when we talk about more professionals and better-looking themes IMO), and also you have to code almost any special solution by your self, but well I do enjoy coding, so the effort is well paid back.

Then later, of course, I arrived at the point of having to deploy the site and you find Netlify, well then is when you are really not able to believe it, so good. I promise the best way to explain it, is just to try it.

I'll update if I have to change my page engine again, but honestly, I'm keen to try out the possibilities we could get with this stack, and this blog is just the beginning.

Additionally I prepared a README file in the website repo to explain the problems and the solutions I implemented in the site, just if someone is interested, I will continue updating it while I update the page.

Since I started to work as developer I’ve been very worried about which code editor or IDE to chose in order to write as conformable and faster as posible.

My first professional contact with text editors was with the Oracle Jdeveloper which offered a far best approach from old and rustic Kawa used during my practice classes at the University. It was a really helpful to have such helpers which underline what was wrong of your code before having to build the project, but still I was just looking at the surface of what modern IDE's will bring us as developers.

When I started working full time, it was when I realized about the importance of a good IDE, and after some research and collage requests, I started with Eclipse IDE. I spent a lot of time trying to find plugins, learning all key shortcuts to work faster and understanding how to use all the advanced features of it, ( eclipse wiki page helped a lot ). After some years of usage, I was very proud of my work flow.

But suddenly new topics come to scene; application deployment, maven to manage our big projects and even some server administrator task, and at this time I knew that no advanced IDE will help me with this kind of tasks. The more far we where from defaults / typical projects, the more old school tools I was forced to use.

The truth was that at first it was really hard to get used to all this kind of tools and the new problems that come with them ( lot of bash problems but, server exceptions, having to dig into logs, Java Out Of Memory exceptions ...) but, like it happen with everything in life, I started to control this new environment. The more comfortable I was with this new scene, the less tools I was using, mostly VIM + bash console to configure server remotely.

Because my old companies restriction, I have always been force to use windows based machines, and because of that windos cmd and even the new powersheel were a little bit disappointing, mostly because paths restrictions, python, node.js and other environments poor integration with windows machines and so.

The good news for me is that with my new professional path as freelance developer, I have freedom to choose the tools I want to use, and this means to be able to work with a unix machine ( in my case just a macbook air 13-inch ). This allow me to be able to work just with a text editor ( the awesome Sublime Text Editor 3 ) + terminal console to do all my job tasks; Deployment task, Track my code against git repositories, have jekyll ( to work on my blog ), grunt servers ( at my daily job as front end developer ), alias to run commands faster, use links to do really cool deployment things in collaboration with Dropbox, use all my VIM learned knowledge thanks this really really powerful vintage feature of sublime ... and far more.

All that said, I can confirm I'm far more faster, reliable and versatile in my job after having forgotten about these fancy smart IDEs and having gone back with old school tools. That's something that some companies used to forget, believing that treat us as 'Software factories items' will improve our job, creating restrictions instead of helping to develop our creativity. So as summary, and in my personal experience, I would like to say that as the craftsman who need his own tools to create their own art pieces, a developer needs freedom to create his own work environment.

Well, after a long time without writing it's time to resume my occasional blogger activity, and for this fist 2014 post I want to talk about the new direction a have chosen for my life.

I am from Cadiz but since I finished my career, six years ago, I have been living in Seville and working in big companies ( Indra, Sadiel and Fujitsu ) for the most powerful Spanish client: Public Administration. This was my 'automatic professional direction', and although I was comfortable at job and I have learned A LOT during this period, I had the feeling to miss something, that's why I was always looking for something more.

My studies gave me a good knowledge about Java and good experience but thanks to a couple of subjects at University I was also very excited with javaScript and its possibilities. That was the reason to build TimeLapse as my Final Degree Project, but in this time jQuery was 'starting' to be popular and Dojo was my election as it was one of the mature javaScript frameworks available. Even though, I wasn't able to find any professional option for this path and I just keep improving my javaScript skill as an complement in my CV. At work I was always trying to get all front end jobs I find to put into practice things I was learning as front end because I was hired as Java Developer.

But two about two years ago, something changed, I started looking out of corporative IT world to improve, and found that getting new certifications or demanded courses was not the best way to improve in my daily work. I started attending 'non-typically' professional events as a Apache Barcamp, Open Space, Betabeers, SevillaJS... showing me that a different path than working for big companies was also possible. Even I started to write my first side project

The other thing I was always upset worried about was the lack of ownership of my work working somewhere were I wanted to do my best not only because I have to but also because it's the way to work as a team, but in outsources service projects this was impossible, at least in Spain, where the important was to bill hours and not the quality of the final product.

So after 3 year of English preparation in academies ( Spanish English Education it's thoroughly insufficient ) and a clear idea that I wanted to change my professional direction to javaScript and front end, the opportunity appear in front of me, and I, with no doubt, took it. This is currently the job I'm doing from the beginning of 2014, working in Precursive as Javascript developer.

Then I realized that if I was living in Seville was only because my job were there and I always wanted to have the chance to live in Conil de la Frontera, were I like to go to relax and where the quality of life is unbeatable.

The funniest thing about all these changes was the post-shock I got, even when the decision was logic and I was sure that I wanted to don't miss the opportunity it was given to me, I needed some time to adapt myself:

\n
• From living in a big city to live in a little town.
\n
• From working in a big company in person to work in a real start up from home ( teleworking ).
\n
• From speaking with my mates in Spanish to work in English.
\n
• From using Java, Tomcat, Maven to Javascript, Salesforce ,Angular,Yeoman...
\n

So there is no reason to say I haven't gone out of my comfort zone and now I can really say that I have never been happier and more confident with my decisions, even when I have more responsibility over my shoulders and the work is far harder than at my last job... So it was worth.

First of all I would like to say that I don't use to write technical tutorials or guides but there's always a first time, isn't there?. Anyway this will be more some brief steps to follow more than a technical tutorial indeed but I hope it's useful in order to start using Openshift as your PaaS.

Openshift is one of the best cloud platform recently created to make developers life easier, and once you understand how it work it and how to use it it will become a great place where deploy your projects. Otherwise it is also true that some time is needed to get ready to be productive with it. I like it because I think you have enough flexibility ( more than most of cloud PaaS available ) but it gives you a lot of work solved, without considering that there is OpenShift Online account that it's for free.

There is a great documentation in the official Openshift webpage and a huge community which would help you with any issue you find. For instance to deploy wordpress in the 'official way' you can find their documentation, but the idea of this post is to explain how I stated using Openshift, deploying Wordpress instances and how I adapt the defaults instructions to work with a local environment synchronized with the Openshift instance.

Prerequisites

\n
1. The first thing you need to do it's to create a new an Openshift account in www.openshift.com/.
\n
2. Then you need to have installed the OpenShift Client Tools (rhc). You will previously need to have installed git and ruby to execute rhc, but the instructions below will also help with that.
\n
3. To configure your local rhc installation Openshift provides an easy to use command to generate all the configuration. The configuration will be stored in ~/.openshift/express.conf file. The command to start with the wizard configuration is: $rhc setup.
\n

Deploy in OpenShift

\n
1. Once we have our environment ready to connect to Openshift, the next step is to execute the creation command using my forked wordpress-example. I created it because I changed some little things in my way such as deleted the worpdress sources ( so we use the last update in our installation directly instead of the old one in the official Openshift wordpres-example ) and I prepared some helpful alias in the deploy script ( so the configuration in the Openshift instance will be automatic and won't conflict with the local configuration, even using the same sources ). The following command will also clone the current gear structure in a folder called like 'yourWPName' ( of course you can change to the name you want for your wordpress installation ). $rhc app create 'yourWPName' php-5 mysql-5 --from-code=https:// github.com /robertovg/ wordpress-example. The wizard will ask you about 'yournamespace' ( the name-space where all your gears will be allocated ).
\n
2. Then we have to download the Wordpress sources we want and unzip it into <cloneDirectory>/php folder. It's important to remember where is our <cloneDirectory> because we will use it again in the followings steps.
\n
3. Afterwards we add, commit and finally push all files to the git repository, so you will have an instance of the wordpress version you have downloaded up and running in the following url: http://yourWPName- $yournamespace .rhcloud.com.
\n
4. It is a good idea to configure your Wordpress instance through the web console (wp-config), do not install any plugins or theme yet. And with that you will have your Wordpress instance installed and running in Openshift.
\n

Sync your local environment with Openshift

\n
1. \n

   First we need to have installed an Apache server compatible with PHP plus a MySQL database . You can do it in the way you prefer but I recommend you using MAMP, XAMPP, bitnami or a tool like these ones.

   \n
\n
2. \n

   We need to make a backup of our Openshift Wordpress Gear ( it's highly recommended to do it each time to keep your data secure ), so we can generate the same instance in our machine cloning the database, this is useful to have exactly the same configuration. So we execute this command $rhc snapshot save yourWPName, and in the current directory it will generate a 'tar.gz' file, once we unzip it we will find a 'app-root/data /mysqldumpsnapshot.gz' inside, now we need to connect to our local mysql and execute the script to have the same database as in Openshift instance. 'app-root/data' will also contain all uploaded data to the Openshift server ( gallery, plugins, themes, uploads).

   \n
\n
3. \n

   Then we need to configure our Apache to point to our <cloneDirectory>/php. We can do it in very different ways but I recommend to use alias in the httpd.conf Apache config file. First we need to know we have enabled 'aliasmodule' at the beginning of the file. Then we need to add the following code in the `<IfModule aliasmodule>` section or alias.conf file, if exists.

   \n

   Alias /yourWPName '<cloneDirectory>/php'
   \n<Directory '<cloneDirectory>/php'>
   \nOptions Indexes MultiViews +FollowSymLinks
   \nAllowOverride All
   \nOrder allow,deny
   \nAllow from all
   \n</Directory>
   

   \n
\n
4. \n

   The next thing is configure .htaccess-alias and wp-config-local.conf. These files can be found in the <cloneDirectory>/php. The first one indicate the configuration of the alias for our local Wordpress instance so we will need to change the 'alias' to 'yourWPName' or to the name of your local instance. The second file is the Wordpress configuration file, you will need to configure the database information to make the just restored MySQL accessible.

   \n
\n
5. \n

   When we have these two files with the correct configuration, then we will need to create two alias. So that we move to the <cloneDirectory>/php with the terminal and then we write:

   \n

   $ln -sf .htaccess-alias .htaccess
   \n$ln -sf wp-config-local.conf wp-config.conf
   

   \n
\n
6. \n

   The next thing to do is to change the 'siteurl' and 'home' rows in the 'wp_options' table of MySQL. This is important because, otherwise we won't be able to access to the server. So there will appear http://yourWPName- $yournamespace .rhcloud.com or something similar, and we have to change it to http://localhost/yourWPName.

   \n
\n
7. \n

   The next step is to start or restart your Apache server tool and start using our Wordpress locally.

   \n
\n
8. \n

   Finally you will be able to change themes, install plugins and so. All this changes first in the local environment and then add, commit and push new or updated files to the server. In this way your changes will be automatically deployed into the production ( Openshift ) environment and everything will be first checked locally and changes stored in the git repository. It's important to know that pages, post and this kind of information have to be pushed to the server with the MySQL script. So just to clear the information, plugin and themes changes from local to server and post ( through git ), pages and BD changes from Openshift instance to local ( through backups step 4 ).

   \n
\n

\n

So more or less this is a brief resume how I'm using Openshift to play with Wordpress instances.

\n

Summer is almost over, colder days are coming and spending a few more time in front the screen developing at home looks far more logical than months ago.

My first no-beach Sunday gave me time to finish and publish Audio Station Steroids, mi first Google Chrome Extension.

I have been using this extension for months because I wanted to keep my last.fm updated with the music I listen through my DiskStation but it hasn't had a good looking until Nuria helped me with the fantastic icon she designed to me.

I've started this project because I really wanted to have real project where to put into practice the theory I have been learning and reading about the new wave of JavaScript that it has appeared recently with libraries such as backbone.js, underscore.js, express.js, node.js, mocha.js, etc. Along the way I got some more knowledge, for example getting to know how to develop Google Chrome Extensions or how to manage PaaS options like OpenShift or AppFog ( which finally I choose in this case ).

So I could say that I wanted to do something useful ( firstly to me ) and it could bring me the opportunity to learn and practice with a project built from zero. And I did it! Let me explain this a little more.

After some time using it I realize that, why not to publish it in the Chrome Web Store and let other user of last.fm and with an Synology DiskStation use it? And now you can find the extension in the Chrome Web Store.

Another thing was, it's good to learn and practice all this new technologies together in a real project so, but it is very selfish to keep all this code stored in my machine so..., why not to publish the sources in a public repository of both the Chrome Extension and the BackendEnd needed to make Scrobblings work securely? And again I also did it.

\n
• AudioStation Steroids Google Chrome Extension in this Github repository: https://github.com/robertovg/audiostation-steroids.
\n
• Steroids Gateway a node.js backend created for security proposes on this repository: https://github.com/robertovg/steroids-gateway.
\n

The truth is that although I am not thoroughly proud of the result of this project, I am happy enough to show it. I hope that is useful.

We are currently living strange times where our path is no longer well defined for any of us. Financial Crack, Several Corruption Cases in all the layers of our system and the biggest Ethical Crisis never seen before makes ourselves keep lost, hopeless and without trusted model to follow.

So with all social rules breaking our basic instinct and learned morals become more important to make decision but, what it's happening?\nI not writing to praise for isolated well acting or acts of kindness of some people, what would have always been the natural way of behaving between each other, but to complain about selfishness and cruelty I find these days in society, works environments and even families.

I will try to focus on work environment where it's increasingly common to see people fighting each other at work to get a better position in their company, no matter what it cost. It's true this have usually happened in a few cases to promote, but now it about preventively keep their job. Colleges shows rivalry to their coworkers and act against them just to 'survive'. The worse our work conditions are, the worse people treat each other, even causing more hurt and more pressure to them on their daily job than their bosses do!. I have seen examples of this in both public and private sector.

Two important deductions to get; Fighting each other would just create a new problems to resolve, and of course, helping our coworkers will rise our productivity, our results and even our happiness at work. So think twice before acting selfishly with the people you work with.

Sadly the causes which triggered our crisis have not gone yet, we are more and more unmotivated 'to rise against the system', probably by the learned helplessness our politicians have produced us with their passivity in helping people, lying in everything and making us feel not to have any control about the decisions the make about our future. We, as a whole, start to look more like a huge asleep group of starveling pigeons than humans. In summary it's difficult to find hope in this panorama until we start to react, to regroup and to fight.

Consequently the worst is yet to come, therefore we had better try to make stronger communities to stay better prepared to shed light on these coming future shadows.

Image by Flickr user Kali99 used under a Creative Commons license.

It's curious how the time makes you improve with almost everything. People sometimes get the wrong idea of losing faculties with the time and this is only true for physical and mental deterioration but within healthful limits, you will be more productive to accomplish tasks you know with time.

I enjoy switching my routines, learning new hobbies and changing the ways I take to achieve my goals. In this process it's easy to leave behind some abilities, in spite of what would be natural, we don't forget them but we improve what we know to do, like wine, our talent gets better with time.

Well, it's true that there is nothing new with that, just the experience concept, but the amazing thing ( for me at least ) with is that you keep improving also without continue practicing a ability.

I realized about this reflection some days ago, but it fits perfect in different aspects of my life. I, as developer, use to check it when I learn a new technology, library, framework for coding I use them better after a while rather than just after having learned them. Ok, the way for explaining this is simple you need time to assimilate what they have learned. But not only a little period, sometimes we are talking about years, and without practicing during that time, e.g. I've spent more than a year without coding PL/SQL ( either pure SQL just some criteria queries which are too different ) and now it's by far easier for my to write difficult queries than before, and this is amazing, I remember better how to think in the old way of SQL than when I learned it.

Even more astonish is what happen with the guitar and songs I learned with, with no rehearsal those songs I used to play, they sounds better when I start playing them again after some months or so.

After more than one year using my reflex camera just for taking events pictures ( like christenings, weddings, communions, birthdays and other family events ) in which you don't use your camera for creating art photos but just to remember this moments, it awesome to realize how I master my abilities and I'm able to control all of them to do exactly what you want to express within a shot.

Check this photo, from a set of pictures I took in Río Tinto in early May.

Another good thing about it's the perspective you get when you resume an activity that you stopped practicing and the better election of the ways to resolve a problem o express a feeling you can do. Of course this is be caused because your brain sort what you have learned with time, giving you the right control over your learned skills.

It's amazing the feeling that there is always place for more and what you already know will improve by itself, so you know; You can never learn too much.

\n

PD: This is my first time I use Markdown in a writing, and I'm thoroughly pleasant with.

\n

Learn English:

Look for services instead app:

Be the client not the product:

Do not put your eggs all in one basket!

Image by Flickr user jurvetson used under a Creative Commons license.

\n\tI usually try to stay up to date, and it is obvious that as a programmer I use the Internet to do it, but the Internet is wild and huge enough to make you get lost.\n

\n\tSo it is important to keep yourself focus on what you can do with the time you want to spend into. With this in mind, I would like you to explain how I usually 'rise against the procrastination'.\n

\n\tI take the information from blogs through Google Reader, which is the easier, faster, and easy way to follow many websites. The problem is that saving time getting the content is not enough to me. So I split the news consuming process in two task;\n\t

\n\t\t
• Get the shorts or breaking News read, directly from Google Reader
\n\t\t
• All the important news, articles or even tutorials I haven't enough time to read directly from Google Reader, I just Read it Later.
\n\t

\n\tThat is, there are a lot of services to read the web later; Pocket, Instapaper, Safari Read later feature and its integration with iOS 5 or later. There are services as strangers than blackstrap.it, which takes selected articles from your Instapaper or Pocket queue and binds them into a book. But with no doubt the best 'Read it Later' service was Readability (no longer available..., here a 2018 guide of the best RSS Readers). Its usability is awesome, it has got applications for most of Operative Systems ( officials and unofficially applications through its API ), you can make any web site more reading-friendly just with a browser extension and it has the 'send to kindle' feature witch allow you to read the articles, news and anything you can find on the Internet into your device. This is important because it is not very comfortable to read long texts into a computer screen and it is easier to carry with a kindle device than with a computer. And last but not least, it is thoroughly free!.\n

\n\tSo with a good plan to read, the Internet can be tamed without spending too much time.\n

Image by Flickr user ZeroOne used under a Creative Commons license.

\n\tI've finally finished 'The Passionate Programmer' by Chad Fowler one of 'technical books' I've most enjoyed. Specifically this is not an technical book but a book for technical developers who want to learn about the experience of a successful engineer.\n

\n\tThe book is based on Chad's personal experience. He always try to give you the good parts from each one allowing you to learn his conclusions directly from the text.\n

\n\tThe stories you'll find inside the book ( I won't spoil it to much ) are not only about Software Development Industry, before he becoming a programmer he started his career as a full-time saxophonist and a lot of his lessons are extracted from this period and surprisingly all of them fit nicely into IT world. I'm also a musician, I play the guitar in a blues band, just for fun, so that all his music examples sounds familiar to me.\n

\n\tOne of the good parts in the book is the end of each section called 'Act on it' in which Chad Fowler send you homework about the topic of latter section.\n

\n\tThe books it's structured into five main blocks:\n

\n\t
• Choosing Your Market
\n\t
• Investing in Your Product
\n\t
• Executing
\n\t
• Marketing...Not Just for Suits
\n\t
• Maintaining Your Edge
\n

\n\tA three first chapters brief resume could be the title of this one: 'Love It or Leave It', yes there are a lot of pieces of advices, so much useful, but the point is this one, according to Chad: 'You have to be passionate about your work if you want to be great at your work' that simple, but it really is. If your are really interested into Software Development you will find the way to be become a good Developer. Having said that, if you are crazy about Software you will learn a lot reading it. I really like the point of view he transmits about your carer treating it as a product which you want to succeed.\n

\n\tThe next chapter was the most useful for me, and I think that it's the one that most technical people usually forget. To have a good marketing is as necessary as to have a brilliant product, and I usually forget it.\n

\n\tI feel the last chapter as series of challenge more than as advices, but of course I think that all of these challenges are different steps that we, as programmers, must climb.\n

\n\tIts price ( $15.00 ) thoroughly worth, so in conclusion I recommend it to everyone who loves and cares about Software Development!\n

\n\tPara este post me ha parecido conveniente dejar mis pretensiones por el bilingüismo aparcadas y limitarme a escribir en el idioma de Cervantes mi experiencia vivida en el #barcampes Sevilla 2012. Para empezar he de decir que pasé un sábado genial, tanto por las personas que formamos este barcamp 2012, como por la organización ( que estuvo increíble ), por los patrocinadores y por la calidad de las charlas a las que asistí. Una experiencia más que recomendable para cualquier amante del mundo del desarrollo.\n

\n\tLa primera charla en la que estuve fue la que dio @ydarias sobre CoffeScript. En ella nos hizo una presentación muy interesante en la que resaltó su funcionamiento y los problemas que JavaScript tiene como lenguaje ( los famosos JavaScript WTF ) y cómo CoffeScript los solucionaba.\n

\n\tPosteriormente fui a una de herramientas webs, concretamente @nachocoloma nos explicó los secretos de Google Chrome, Sublime Text Editor 2 y LESS. Me resultó muy rebeladora porque aunque trabajes habitualmente con estas herramientas, siempre enriquece mucho ver la forma de trabajar de un crack como Nacho.\n

\n\tLa última charla a la que asistí, antes de la hora de la comida, fue una charla sobre BDD con Javascript que @carlosble impartió. He de decir que leí su libro hace ya tiempo y que siempre lo he tenido como referente de cómo hacer 'bien las cosas' a la hora de programar. Disfruté como un enano viendo como utilizaba Jasmine y como había resuelto el problema de tratar con los test punta a punta con javascript preguntando con dichos test por el resultado que el usuario espera obtener en el propio documento HTML.\n

\n\tDespués de la comida @csanchez nos estuvo enseñando git avanzado. Y, aunque más que una presentación fue una improvisación sobre cómo tratar con git de forma avanzada, se pudo sacar mucha información.\n

\n\tLuego asistí a la charla de @itortv nos mostró los entresijos que hay detrás de Karmacrazy, experiencia muy valiosa que tuvo a bien compartir con todos los asistentes. No mucha gente muestra esa transparencia ya que no se cortó a la hora de responder a las preguntas que le formulamos, detalles sobre su arquitectura, costes de hosting, etc.\n

\n\tYa por último, la mejor charla del #barcampes según el resultado de las votaciones de los asistentes ( realmente hubo un gran nivel en todas ellas, pero ya se sabe, solo puede haber un ganador ) que fue @aitorciki con su 'Push and pull: web de tiempo real'. La verdad que me gustó mucho la manera que encontró de explicar las distintas soluciones que se le habían dado al tiempo real en la web hasta la llegada de websockets.\n

\n\tSi tengo que destacar un aspecto con el que me quedo del evento sería la cercanía que demostraron todos los ponentes con los que tuve la oportunidad de charlar.\n

\n\tFue una pena no poder asistir a la fiesta en la ºarbonería, pero al menos me quedé con un excelente sabor de boca con todo lo aprendido y la gente que conocí allí.\n

\n\tPor supuesto repetiré el próximo año y animo a todo aquel que tenga la oportunidad de asistir y/o fomentar eventos de este tipo que lo hagan. Humanizan a todos los que estamos al otro lado de la pantalla.\n

\n\tSix month ago, I lost my dear iPod Classic 80 GB which I used every day for four years until this tragic moment... now I can say, I don't miss it at all.\n

\n\tWhen I lost it, I had a big music library with about 70 GB and now it consists of more than 100 Gb of mp3. It's so comfortable to be able to listen to your full library always when you want and off-line (without Internet) only using this device, the bad part comes when you have to manage its content.\n

\n\tYes, I know there are several alternatives to iTunes, but the owner of an iPod usually manages his library with iTunes ( Window's iTunes in my case ), which is the slowest program ever I've used just doing... everything and use to fail, especially when your library is on your local network because there's no enough free space in your PC's hard drive. With all the above I can ensure the process of add or edit music on this device was tedious, it forced me to have to use always the same PC, and it used to take me a long time...\n

\n\tAt home I have a NAS where I put every digital thing, and my music library is not an exception, specifically it is the Synology DS211j, one of best purchases I've ever made, after the loss I started using it as music streamer as well as NAS. Synology has his own Operative System accessible via HTTP called DSM, so I can access to it anywhere and with any device. For example I listen to music at work via Synology Audio Station inside any browser, and with my iPhone and Android devices through DS Audio so, in this way, I can access to my personal music library anywhere if I am connected to Internet. In addition DS audio has the availability to make a buffer with the last songs you have heard and even specifically make any list off-line available...\n

\n\tWell... this is not all, now the process to add songs to my library could not be easier, just add mp3 files or folders inside an specific folder DSM create for your music library ( /music ) and all these songs will be available on all each sources I enumerated above. And you many also edit ID3 tag of each song by revising its detail information to keep every piece of your music well-organized.\n

\n\tAnd before finishing I would like to explain something more I usually do when I listen to songs with digital devices... scrobbling them to last.fm. Of course when I used to synchronize my loss iPod with iTunes, the official last.fm scrobbler did its work. The problem now is that neither Synology Audio Station nor DS Audio are last.fm compatibles and this problem has a partial solution: Synology Scrobbler, this is a Google Chrome Extension which does the job of scrobbling and which I had the honor of collaborating with thanks to @dalager, but that's a different story.\n

This is the first article a write entirely in English and the first one I do in this platform with Jekyll, and I have to admit that I find it much more familiar than I expected, because it's such as write code documentation, and it makes me comfortable. Of course I know this article will have some spelling mistakes, but I really think the best way to learn English is to practice it, so ... here we are.

In this article I would like to explain why I have changed my personal blog to github. Here goes the reasons:

\n\t

\n\t\t
• \n\t\t\tOne of the main reasons is that with github:pages you have always the control. Github:pages allow me to change all documents html, css or js directly ( back to the roots ), I can redirect this page to my custom url domain name, or even I can make little js experiments without worry about the price I have to pay to do these things in your own blog.\n\t\t
\n\t\t
• \n\t\t\tThe second reason is that is that it is simplest way of publish static content. I think most of websites of the Internet don't need to be in a dynamic server ( php, ruby, python, java or whatever your server language is). They just do what the most of web does, but if you only show content, why to use a CMS or something like that?. There are a lot of disadvantage, CMS are a more complicated way to publish, you need a database, the server side and to install the same things you have in production in your pc / mac to view what are you publishing before doing. And these are futures problems.\n\t\t
\n\t\t
• \n\t\t \tStatic for the web is not as bad as it seems to be , if you don't need it. Ok, the problem of organizing and maintaining a big website with only statics files is there, but there are a little trick, just use a little of ruby to transform your organized files in a fully functional static web with jekyll . You even have available template engine with liquid and Yalm to specifies properties of each post, and in that way it possible.\n\t\t
\n\t\t
• \n\t\t\tThis hosting it's free, and when I say free I mean in deep meaning ( without advertises as does happen in wordpress ) so github:pages is there to make developer life easier. There are such options as ruby + git hostings exists, for example; Heroku, but they are not completely free.\n\t\t
\n\t\t
• \n\t\t\tdhtml rocks! Well... this is my favorite argument, yes with javaScript you can do everything you are used to do in the server side running javaScript code in each client adding content in pages 'dynamically'. For example the comments in this blog exists because of Disqus service witch inject comments functionality after each article content by running a piece of code. And comments are only the beginning you can really do a Rich Internet Application without a dynamic server ( using other services that do have...).\n\t\t
\n\t\t
• \n\t\t\tJekyll is more accessible than it looks, if you are not developer but want to use this way of blogging there are easy to use 'frameworks' / 'engines' that allow you to make a blog without coding knowledge; Octopress, Jekyll Bootstrap or the own github:pages automatic generator, will help you to start.\n\t\t
\n\t

So, is this information new to you? Do you agree or disagree with the possibility of doing a blog or a web page with jekyll instead of whatever CMS?

\n\tEn el post anterior de esta serie, hablé un servicio que administra nuestros gustos musicales, ahora le toca el turno de hacer lo mismo pero con las películas y las series de televisión.\n\tEn el mundo de  además con más variedad: Tenemos dos servicios que podemos utilizar para administrar nuestros gustos\n

\n\tIMDb semi-abierto para empresas cerrado para usuarios ( a no ser que tengas 15.000 $ para coger tus datos).\n

\n\tPor ejemplo un servicio que guarda similitud con last.fm pero relacionado con el  mundo de las películas y series es Filmaffinity. Una gran idea, con muchísima funcionalidad, y que su cometido lo desempeña muy bien. La gran diferencia entre este primero, es que tus datos no son accesibles más bien es justo lo contrario no hay forma de sacar tus datos de Filmaffinity,  por lo cual siempre vas a estar atado a sus políticas de servicio, además me he puesto a buscar si había alguna forma de eliminar mi cuenta y no la he encontrado.\n

\n\tEsto al menos en mi opinión, es una forma tonta de empobrecer tu servicio, en Internet tienes que hacer accesibles por diferentes medios tus datos, brinda apis, darles el control a los usuarios sobre sus datos a los usuarios, esto hace que no se sientan atados, y seguro que mejorando la confianza de tus usuarios, creces. Las políticas severas y cerradas, a mi entender no tienen cabida en lo nuevos tiempos.\n

Hoy es habitual que guardes tus datos en la llamada nube, en Internet vamos. Es algo que haces constantemente y casi sin darte cuenta. Esto no es nada nuevo, seguro que utilizas gmail o hotmail en vez de tu Outlook u otro programa de correo o escuchas tus canciones con Spotify en vez de con ese viejo winamp 3.X que te acompañó durante tanto tiempo. Esto se puede plantear como un problema y también como una ventaja, pero lo que sí es cierto es que ésta es una tendencia general de los usuarios de Internet.

Antes de valorar este hecho, me gustaría hablar de diferentes aplicaciones que se han servido de esta tendencia para sacarle partido con estrategias muy diferentes: last.fm, IMBd y Filmaffinity (dejaré éstas dos últimas para otro post).

Last.fm es una de esas aplicaciones que utilizas casi sin darte cuenta, no te molestan y te aportan mucho cuando empiezas a comprender todas sus posibilidades, y lo digo porque no es inmediato ver su potencial.

Por si aún no lo conocías, last.fm es un servicio que se encarga de conocer tus gustos musicales, ¿cómo un programa va a conocer qué es lo que te gusta?, …pues bien, él simplemente se va a ir enterando de la música que escuchas.

La idea del funcionamiento básico de last.fm se puede explicar en unas líneas. Se basa en algo que ellos denominan scrobblings y que representan cada tema que tu has escuchado. Cada vez que escuchas un tema en soporte digital, un “programita” que ellos te facilitan llamado scrobbler se encarga de “decriselo” a last.fm ya sea desde tu dispositivo iOS o Android o instalando el programa en tu ordenador windows, mac osx o linux. Así que resumiendo, last.fm se entera de lo que escuchas cuando:

\n\t
• \n\t\tEscuchas una canción en tu ordenador a través de tu reproductor favorito, como por ejemplo Spotify, iTunes, Winamp, Windows Media Player, Rhythmbox, Banshee, Amarok, Songbird, VLC …(y un largo etcétera).\n\t
\n
• \n \tCuando escuchas algo desde tu ipod, iphone, o cualquier dispositivo con android.\n
\n
• O cuando sincronizas tu mp3 o mp4 con tu ordenador.
\n

Fondo de pantalla generado con las carátulas de mis discos más escuchados

Es decir que last.fm realmente te puede conocer de muchísimas maneras y sin tener que cambiar tus hábitos, instalas el “programita” y te olvidas. Pero a ver, ¿qué es lo que gano yo diciendoles a los de last.fm que es lo que escucho?

\n\t
• Tienen la opción de pagar por una radio (3€ al mes) que como ya te conoce perfectamente, te va a poner música acorde con tus gustos.
\n\t
• Te va a recomendar, nuevos artistas, nuevos discos, conciertos, festivales, etc., relacionados con la música que tu realmente escuchas.
\n\t
• Tiene un componente social, que aunque no lo potencian todo lo que deberían, está muy conseguido. Por ejemplo puedes buscar gente con gustos musicales parecidos a los tuyos para ver qué grupos escuchan y así conocer novedades.
\n\t
• Por último, y para mí lo más importante, tu eres dueño de tus datos, aunque ellos lo administran, tu tienes el control.
\n

Last.fm hace que toda esa información que recogen de ti sea accesible de hecho puedes acceder a ella desde su web, a través de rss y desde la api que ofrecen. Ello posibilita que terceras aplicaciones puedan enriquecer tu experiencia con todos esos datos. Además, tu eres quien tiene el cotrol de tus datos; puedes borrar de tu lista de scrobblings un artista o canción en concreto o si así lo decides, puedes borrar tu cuenta haciendo desaparecer todo el rastro que hayas dejado en el servicio. Me parece muy importante tener todas estas opciones para sentirme agusto con un servicio web.

Pero no todo iban a ser cosas buenas, un fallo general de diseño que tiene last.fm es que no se pensó mucho en los scrobblings offlines. Estos scrobblings son los que se realizan sin conexión a internet, por ejemplo cuando escuchas canciones desde tu reproductor de mp3 o desde tu ordenador estando desconectado, que suelen ser la mayoría. La limitación es que no te deja hacer scrobblings con fechas “muy” antiguas si ya existen scrobblings más recientes. Esto no debería ser un problema, pues cuando escuchas una canción, la siguiente siempre la escucharás en una fecha más reciente. El problema viene cuando por ejemplo escuchas canciones en un reproductor, al día siguiente te pones a escuchar Spotify haciendo scrobblings y luego sincronizas tu reproductor con tu ordenador; todas esas reproducciones no se podrán enviar ya que al tener fechas más antiguas que las que le llegaron cuando pusiste el spotify, el servicio de last.fm directamente las ignora, para protegerse de peticiones erróneas.

Parece un problema rebuscado, pero es algo que suele pasar más de lo que piensas, así que mi consejo es que si sueles utilizar un reproductor y también reproducir música desde el ordenador, lo tengas en mente y decidas qué vas a conectar a last.fm, ya que si lo conectas todo, puede que no se te actualicen las canciones escuchadas de manera offline.

Como dato curioso, decir que last.fm tiene hasta dispositivos físicos, como éstos de Logitech que reproducen su rádio:

Squeezebox duet: dispositivo compatible con last.fm

Y tú, ¿utilizas last.fm?, ¿conoces otro servicio similar?.

Logotipo last.fm | Wikipedia

Fondo caratulas generado con “Last.Fm personal wallpaper generator” | URL

Gama de dispositivos Squeezebox | Logitech\n

Bueno, llevo bastante tiempo queriendo escribir, es una idea que siempre me ha asustado porque sinceramente las letras y yo nunca hemos hecho demasiadas migas. Aún así creo que puede ser una buena forma de aclarar y compartir mis ideas con la gente que hay al otro lado Internet (contigo) y con algo de suerte colaborar en crear contenido de calidad en internet, al fin y al cabo The Internet is a Series of Blogs

Aunque seguramente irá cambiando conforme transcurra el tiempo, me gustaría reflejar las intenciones que tengo a la hora de crear blog:

\n
• Este no es un blog especializado, intentaré abarcar las distintas temáticas que me interesan o que no me dejan indiferente. Hablaré de informática (tanto como usuario como desarrollador), productividad, música, fotografía, sociedad, ideas, personas y experiencias que me influyen siempre y cuando vea que es relevante compartir.
\n
• Con respecto al punto anterior, clasificaré las entradas con pocas categorías que reflejen las temáticas del blog. Mi idea es ofrecer un punto de entrada al contenido que te interesa según las temáticas que creas más importantes.
\n
• Mi 'meta' es escribir entradas directas y densas, intentaré ser concreto y no rellenar cada entrada con 'paja'.
\n
• Si la fuente de la chispa que desencadena un post es referenciable, lo referenciaré.
\n
• \n

  Por supuesto todo lo que escriba aquí va a ser subjetivo, esta es mi visión de las cosas.\nya por último, intentaré escribir al menos un post a la semana, ya que sin constancia ningún proyecto llega a buen puerto, y esto es un proyecto más que me planteo.

  \n

  Espero realmente que disfrutes de la lectura, nos vemos pronto.

  \n

  Foto de Cabecera | Pablo Zárate's

  \n
  \n
\n