Lately I’ve found myself trying to make an embedded youtube video responsive… and guess what? It wasn’t “plug&play” easy. Eventually I’ve found a solution that works like a charm and therefore to pin it for good, I’ve decided to share it with you.
This easy solution is more like a snippet of code, but still useful and it works across all the major browsers, I even tested it in Internet Explorer 10, bulletproof… rofl.
What I needed:
The video to resize depending on the browser size, but when you add the video to the page it has a fixed height…
Since ES6 came out and started gaining traction, I was one of the early adopters to some of its features and like many developers I’ve came across a few tips and tricks that I want to share with you.
This article isn’t meant to be a tutorial, it’s just exploiting the new syntax, and I’ll reference some code snippets in a random collection of ES6 features.
On to the code!
ES6 template literals aren’t really “templates” per se… more like strings literals actually. …
Last year I made the commitment to read more, it didn’t need specifically to be in quantity by measuring the total of books read, but in quality instead.
I had previously established a list of books to read, but during the time I deviated a little in this list. In my last blog post the books list was:
1 — Happiness by Design: Change What You Do, Not How You Think
2 — Hooked: How to Build Habit-Forming Products
3 — Antifragile: Things That Gain from Disorder
4 — Start with Why: How Great Leaders Inspire Everyone to Take Action…
Clean and organize HTML, that’s what we as Front-end Developers always aim for. Well with Pug, formerly known as “Jade” (a registered trademark, and as a result a rename was needed) it’s a high performance and feature-rich templating engine that’s easy to achieve. Simply put, Pug is a clean, white space/indentation sensitive syntax for writing html.
Just like SASS, Pug is a prepocessor and, as such it helps you accomplishing tasks like wrapping away repetitive work by providing features not available in plain HTML.
It provides the ability to write dynamic and reusable HTML documents, its an open source HTML…
To continue the formed habit of reading, I challenged myself to read one book every 36 days. Why 36 and not 30? Because I prefer to give myself a little extra time to finish and really assimilate and understand all the knowledge in the book instead of just swipe my way across the book for the sake of saying “Yes! I managed to finish this book in one month!”, that’s why the 6 extra days :)
So here’s my list for the next 216 days:
Last week somehow I managed to break my smartphone screen. It’s a BQ Aquaris E5 and it felt screen faced on the ground, resulting in a broken screen and LCD!! :(
The touch functionality is gone, and only the side buttons are working now, so my first thought was, no problem I’ll connect it to the computer and navigate in the file tree to pull back all the files that I want… nope, not going to happen. I don’t have the USB mass storage mode enabled.
I need a micro USB cable to connect a mouse, this way…
A lot of good stuff happened last year, this blog got a makeover to start! How cool is that?
Professionally I enjoyed working on new projects, with new clients, got a great opportunity to use BackboneJS and ReactJS in two of these projects and both ended up a big success!
Learned to use my time more efficiently, started working with the Pomodoro technique, planning my weeks the weekend before.
Also started acknowledging the importance of working smarter instead of harder, efficiency over performance. What good does it make to perform super well in a non-important task? …
Web Components are a W3C standard that is getting really popular nowadays. In a nutshell, Web Components allow us to encapsulate and share reusable components or widgets.
In web development, the combination of libraries and frameworks used in a project is big, as is the amount of testing required to make sure everything works well together. As the application grows over time, it becomes harder to maintain the code and make enhancements. As you can imagine, this makes the development process not as smooth as it could be.
For each project, we create components: a tabbed navigation, a menu, modal…