dataperiod

[dataperiod]

3-steps guide to mirroring your phone screen

This week I have been planning to test out a supercool way to use your Android as PC, and after a myriad of crazy workarounds for getting it working, I ended up breaking my head against mirroring. Let's face it, mirroring should be the easiest part of the process yet it's not the easiest thing to configure.

Of course, you could just cast your screen using Chromecast or Miracast, but it's wireless and seems to have lag issues. Thus, whether yours is Android or iPhone, I made a 3-step guide to connect to your TV or PC:

If it's iPhone, you better go with its official cable or get an alternative (simply, search for the ones with 3/4+ stars).

If it's Android, check if it's Slimport-ready. You can easily check it in their web.

If it doesn't support Slimport, try with MHL. You can look it up in their web or check it with an app.

[dataperiod]

Out-of-the-box development editor

Learning to manage web projects is sometimes even harder than learning a new language syntax.

From my experience, you will surely get headaches getting a proper code environment, due to the infinite variety and purpose of tools focused on making your life easier. Guess what? They don't.

Thus, don't get worried newbies, let's immerse ourselves into the web development environment the easiest way possible, a FOSS way.

Create on the go

Bear in mind that nevertheless the machine you are writing your code with, it won't help you as much as your creativity and enthusiasm can. If you are working on a 32-bit machine, you should get Visual Studio IDE, as it works like charm and provides everything you need to get your project working.

Otherwise, if you're running on a 64-bit beast, give a try to Atom Editor, built on top of web technologies and deeply configurable with basic knowledge of the HTML, CSS and JS. Anyway, as we're not getting into advanced stuff, its package manager gives an out-of-the-box incredible usability without touching any config file. You can also get a fully experience and continue with Visual Studio, as it follows closely on Atom.

It's always better with a torch

Atom relies on autocomplete-plus, which can be extended on any syntax, for code hints. autocomplete-html and autocomplete-css are native packages, and SASS/SCSS support is also included. For JavaScript, you can get tern-js, which follows the same plugin philosophy. In addition, you can extend its usability with plugins.

As well as for Atom, Visual Studio has also built-in autocomplete for HTML and CSS, but it also includes JavaScript and TypeScript (a syntax on top of JS) autocompletion out of the box, which is really awesome!

If you are currently coding HTML or CSS a lot, you should definitely try emmet.

Let the front line do the work

When you are developing, it is very likely that you spend a great % of time configuring and debugging your environment. To minimize this effect, there are a standard of tools that are used to get your code running in less time:

If you want to use external libraries, instead of adding it to your .html in form of <script src="..."></script>, you can download them and develop without worrying about connection. For this, package managers simplify the task with just downloading them and importing into your project in the way of var X1 = require('my-package'). NPM is the main package manager for web development.

If you are developing bigger projects, simplifying your code structure into smaller .css or .js files and then joining them all together in your index.html, you're doing it raw. Module bundlers wraps several type files into one and add it to your index.html reducing the HTTPS GET overhead and making the whole thing simpler. Moreover, if you are writing on pre-proccessors like TypeScript, CoffeeScript or SASS, module bundlers also transpile them into vanilla code. Although Webpack seems to be the standard, you should go for Brunch, which simplifies configuration in a entirely new way. Both of them support hot reloading (watch for file changes) and development server (automatically launches a local server), as well as scaffolding (get a project template, with ready-to-use libraries and pre-proccessors)

For extra tasks, like backups and logs, you can go for Gulp.