Guil Hernandez
Treehouse Teacher
Delray Beach
I'm a front-end design & development teacher at Treehouse!
Topics & Specialties
Courses & Workshops I've Taught
-
13 minWorkshop
Hosting a Website with GitHub Pages
GitHub provides a simple hosting solution called GitHub pages that lets others view your repository like any other website. Learn how to host your website, for free, on GitHub Pages.
Viewed -
Course
- 1
- 2
- 3
JavaScript and the DOM
JavaScript lets you create interactive web pages which can respond to a user's actions. In this course, you'll learn how to bring web pages to life using the power of JavaScript.
-
30 minWorkshop
Automate Your Work with Zapier
Zapier automates repetitive, easily replicated tasks in your day by connecting the tools and software you use every day. Learn the essential features of Zapier, what automation is and how it can make your workflows even more powerful. You'll even get to create an automated workflow to help make the most of your learning time.
Viewed -
32 minWorkshop
Introducing Coda
Get started with the basics of Coda! Coda reinvented how we create, share, and work with documents by combining the ease and familiarity of the document and spreadsheet software we're used to with the power, ease, and accessibility of apps. You'll learn how Coda can empower you to make documents that are as powerful as apps, then create and publish a simple Coda doc from scratch.
Viewed -
24 minWorkshop
Learning with Coda
In this workshop, you'll learn how to use Coda as a tool for learning, note-taking, time management, and more by customizing a workbook doc we've built in Coda to best fit your learning needs.
Viewed -
20 minWorkshop
Introduction to New Relic
Learn what New Relic is and how its platform can support you in your learning and professional journey by building better and more reliable websites and applications.
Viewed -
3 minWorkshop
Why We Exist: Our Mission
For this portion of Orientation, we want to share a little bit about the mission of Treehouse. We’ll go in-depth around why this is our mission, how it relates to challenges in our industry, and what this has to do with Ubora!
Viewed -
Course
- 1
Mobile-First CSS Layout
In this course, you'll get hands-on practice using CSS layout techniques such as a CSS Reset with Normalize, a layout wrapper, a sticky footer, and centered content with a full-width header. In addition, you'll learn principles that will help you approach your next project with a mobile-first mindset.
-
30 minWorkshop
Sequelize Model Validation
When working with an ORM library like Sequelize, you can take advantage of its built-in data validation and constraint capabilities. In this workshop, you'll continue to use Sequelize to write robust server-side data validation for a REST API developed with Express. The API allows you to create a user account and retrieve a list of user accounts.
Viewed -
Course
- 1
- 2
- 3
- 4
Data Relationships with SQL and Sequelize
As you follow along in this course, you'll define data relationships for a simple Node application that creates and retrieves movie data. You'll define data relationships in Sequelize models, and create related data (like Movie and Person records) using those models. Then you'll retrieve related data with Sequelize queries.
-
70 minWorkshop
React Hooks
Get started with React Hooks, special functions that let you use state, context, and perform side effects in function components.
Viewed -
9 minPractice
Practice Error Handling in Express
In this practice session, you'll get to sharpen your error handling skills in Express. Handling errors well helps users understand what's going on with your app when something goes wrong.
Viewed -
15 minPractice
Practice JavaScript Loops
Build up your JavaScript skills by practicing the basics of loops.
Viewed -
Course
- 1
- 2
JavaScript Objects
Objects are an essential part of JavaScript; they provide a flexible way to keep track of data by associating a name with a particular value. In this course, you'll learn the basics of JavaScript objects as a data structure (using objects to store key/value pairs).
-
Course
- 1
- 2
- 3
JavaScript Arrays
Arrays provide a way to store multiple pieces of information. An array is a list of values: numbers, strings, boolean values, or even other arrays. In this course, you'll learn the basics of using arrays as data structures.
-
Course
- 1
- 2
JavaScript Loops
Loops are a way of repeating code -- they're handy for repetitive tasks. Loops are frequently used for actions that need to run a particular number of times or until a certain condition is true.
-
Course
- 1
- 2
- 3
JavaScript Functions
JavaScript functions let you create reusable chunks of code. They make programming faster, easier, and less error-prone. They are also one of the essential concepts in JavaScript programming.
-
Course
- 1
- 2
JavaScript Numbers
Numbers are everywhere in programming. You use them to track a player's score in a game, calculate the cost of shipping a product, or count the number of times a "Like" button gets clicked on a page. In this course, you'll learn how to use numbers for useful tasks in your JavaScript programs, including doing math, converting strings to numbers, generating random numbers, and more.
-
Course
- 1
- 2
- 3
- 4
JavaScript Basics
JavaScript is a programming language that drives the web: from front-end user interface design to server-side backend programming, you'll find JavaScript at every stage of a website and web application. In this course, you'll learn the fundamental programming concepts and syntax of the JavaScript programming language.
-
9 minPractice
Practice Serving Static Files in Express
Practice the basics of serving static files in Express, a popular web application framework.
Viewed -
10 minPractice
Practice Using Data with Pug Templates
Practice the basics of passing data to Pug views and generating HTML dynamically within an Express application.
Viewed -
37 minWorkshop
Using Sequelize ORM With Express
In this workshop, you will use the Sequelize ORM and Express to build a simple CRUD application that's connected to a SQL database.
Viewed -
14 minPractice
Practice Importing and Exporting Modules in Node.js
Practice the basics of importing and exporting modules in Node.js.
Viewed -
18 minWorkshop
Debug Node Applications with Visual Studio Code
Debugging Node.js is not limited to using console.log. You can use more powerful and efficient tools like the built-in debugger within the Visual Studio Code editor.
Viewed -
5 minWorkshop
Process Sass with Scout-App
Learn one of the quickest and easiest ways to set up and use Sass in your front-end web development projects, with Scout-App.
Viewed -
Course
- 1
- 2
- 3
Using SQL ORMs with Node.js
In this course, you'll learn how to use the Sequelize ORM to leverage the power of SQL within your Node.js applications.
-
Course
- 1
- 2
- 3
- 4
Asynchronous Programming with JavaScript
In this course, you will learn why asynchronous code matters and how to write code that avoids blocking behavior using three approaches: callbacks, promises, and async/await.
-
Course
- 1
- 2
- 3
CSS Selectors Quickstart
An introduction to CSS selectors for JavaScript programmers. This course covers what you need to know about CSS selectors to complete common DOM programming tasks.
-
6 minPractice
Practice Semantic HTML
In this workshop, you'll practice the basics of semantic HTML. When you write markup that clearly communicates the meaning of your content, it is said that you're writing semantic markup.
Viewed -
10 minPractice
Practice Structuring and Grouping Content
Practice the fundamentals of structuring and grouping content with markup.
Viewed -
11 minPractice
Practice File Paths
Sharpen your HTML skills by practicing writing file paths for images and links.
Viewed -
Course
- 1
- 2
- 3
- 4
JavaScript Quickstart
Get up to speed with the basics of JavaScript. In this course, you'll learn the fundamental concepts and syntax of the JavaScript programming language.
-
Course
- 1
- 2
The JavaScript Ecosystem
In this course, we'll explore the exciting JavaScript ecosystem. You'll learn how Node.js helped JavaScript reach new heights, discover applications and tools built with JavaScript, and evaluate popular JavaScript frameworks, libraries, developer roles, and more.
-
Course
- 1
- 2
The Landscape of JavaScript
JavaScript is everywhere and used in all phases of development from software to hardware. This course walks you through the modern landscape of JavaScript, and what it means to learn and program with JavaScript now and beyond.
-
17 minWorkshop
Using Create React Native App
Learn the fastest way to get up and running with React Native.
Viewed -
44 minWorkshop
Working with the Fetch API
Learn how to use the Fetch API to fetch resources.
Viewed -
8 minPractice
Practice Selecting DOM Elements
In this workshop, you will practice selecting DOM elements with JavaScript.
Viewed -
5 minPractice
Practice Traversing the DOM
Practice Traversing the DOM in JavaScript.
Viewed -
5 minPractice
Practice Template Literals
Practice using template literals in JavaScript.
Viewed -
8 minPractice
Practice Manipulating the DOM
Practice Manipulating the DOM with JavaScript.
Viewed -
37 minWorkshop
Using CSS Variables
Learn how to use native CSS variables to make your stylesheets less repetitive, easier to maintain and more.
Viewed -
26 minWorkshop
What's New in React 16
Get up to speed with new features in React 16, a complete rewrite of the React library.
Viewed -
Course
- 1
- 2
- 3
- 4
Bootstrap Basics
Learn to build with Bootstrap, one of the most popular open source front end frameworks, to help you build a functional design and layout in little time.
-
5 minPractice
Practice CSS Grid: Columns, Rows and Gaps
Practice declaring row and column tracks, as well as applying gutters between them.
Viewed -
6 minPractice
Practice Flexible CSS Grid Layout
Practice using CSS Grid features that adapt your content to available space and intelligently size and position items within the grid container.
Viewed -
8 minPractice
Practice Grid Template Areas
Let's practice using grid template areas, a feature of CSS Grid that lets you assign named grid areas to items, and use those names to position items on the grid.
Viewed -
Course
- 1
- 2
- 3
CSS Grid Layout
CSS Grid Layout provides a built-in, more efficient way of designing grid-based layouts in the browser. It brings a new set of properties, functions and flexible units that let you control the exact placement and sizing of grid components.
-
Course
- 1
- 2
- 3
React by Example
Learn React programming patterns by building an application for keeping track of RSVP's! We'll start at the beginning, using create react app (https://github.com/facebookincubator/create-react-app) to initialize the project, and by the end you'll have a functional application.
-
22 minWorkshop
Using Create React App
Learn to quickly set up React projects using Create React App.
Viewed -
35 minWorkshop
Debugging CSS with Chrome DevTools
In this workshop, we'll explore the most useful and efficient tool for debugging CSS: Chrome Developer Tools.
Viewed -
Course
- 1
- 2
- 3
- 4
HTML Basics
Learn HTML (HyperText Markup Language), the language common to every website. HTML describes the basic structure and content of a web page. If you want to build a website or web application, you'll need to know HTML.
-
Course
- 1
- 2
- 3
- 4
Sass Basics
Sass is a stylesheet language that extends CSS with features like variables, nested rules, mixins, and functions, in a CSS-compatible syntax. In this course, you'll learn to use the powers of Sass to boost your front end workflow. The examples will teach you why you should use Sass in your projects. By the end, you will be writing more efficient CSS using code that is easy to read and maintain.
-
7 minPractice
Practice CSS Box Model Basics
Practice working with the core components of the CSS box model.
Viewed -
6 minPractice
Practice CSS Floats
Practice laying out a web page and wrapping text around elements, with CSS floats.
Viewed -
5 minPractice
Practice Media Queries
Practice writing CSS media queries by adjusting the layout of a simple web page.
Viewed -
5 minPractice
Practice CSS Selectors
Practice basic CSS selectors by targeting and styling elements of a web page.
Viewed -
22 minWorkshop
Introducing Progressive Web Apps
Learn a new way of delivering amazing user experiences on the web with Progressive Web Apps (PWAs).
Viewed -
Course
- 1
- 2
- 3
DOM Scripting By Example
Use JavaScript to build an RSVP web application. Many of the features you'll build are common to other web applications. When you're done programing the app, you'll have the basics you will need to build any client-side web app.
-
Course
- 1
- 2
- 3
- 4
Introducing ES2015
Learn the basics of the ECMAScript 2015, also known as ES6, JavaScript standard. JavaScript has come a long way since it’s inception in 1995. The ECMAScript 2015 specification brought a lot of improvements, the largest set of changes the language has seen to-date. In this course, we’ll review some of the new features and demonstrate how they can be used to build better JavaScript applications.
-
49 minWorkshop
Introduction to PostCSS
Learn PostCSS, a popular CSS processing tool for styling your websites and applications.
Viewed -
Course
- 1
- 2
- 3
- 4
JavaScript Unit Testing
In this course, you’ll use Behavior Driven Development to write unit tests for your functions with the JavaScript testing framework Mocha.js. Writing unit tests will help you improve your code before you even start writing it. You’ll have fewer problems, and better understand the problems you do have.
-
Course
- 1
- 2
- 3
- 4
CSS Transitions and Transforms
CSS transitions and transforms can create simple animations that enhance user interactions in websites and apps. In this course, you'll build an interactive image gallery using CSS transitions and transforms. You'll use transition properties to define durations, delays, and easing functions. Then, you'll learn how to rotate, scale, and move elements in 2D and 3D space, with CSS transforms.
-
Course
- 1
- 2
- 3
CSS Flexbox Layout
Flexbox is a set of CSS properties that give you a flexible way to lay out content. With flexbox you can change the direction, alignment, size and order of elements, regardless of their original size and order in the HTML. You can even stretch and shrink elements and distribute space, all with just a few lines of CSS!
-
21 minWorkshop
The CSS calc() Function
The CSS calc() function performs a calculation and returns a result. calc() allows mathematical expressions that add ‘+’, subtract ‘-’, multiply ‘*’, and divide values ‘/’. In this workshop, you'll learn three useful ways to use calc() in your projects.
Viewed -
22 minWorkshop
Build a Responsive Navigation with Flexbox
Learn how to build a responsive website navigation, using CSS media queries and flexbox layout.
Viewed -
Course
- 1
- 2
Animating SVG with CSS
SVG (Scalable Vector Graphics) also supports interactivity and animation, so you can animate and interact with SVG like you're able to do with HTML. This short course covers the most common methods for animating SVG: CSS transitions, transforms, and keyframe animations.
-
12 minWorkshop
CSS Clipping Paths
In this workshop, you will learn about an advanced CSS feature called clipping paths.
Viewed -
8 minWorkshop
CSS Masks
In this workshop, we're going to cover an exciting CSS design effect: Masks.
Viewed -
14 minWorkshop
CSS Blend Modes
In this workshop, Guil covers how to use blend modes, an exciting CSS feature that resembles a tool you'd normally find in your favorite graphics editor.
Viewed -
Course
- 1
- 2
- 3
CSS to Sass
If you're not sure where to begin when converting CSS over to Sass, this is the place to start. In this course, you'll learn how to convert a simple web project over to Sass (http://sass-lang.com/), the most widely used CSS preprocessor. This course aims to clear up common misconceptions about Sass, and help you fit Sass into your front-end workflow.
-
Course
- 1
- 2
- 3
CSS Selectors
In this short course, we're going to go beyond the basic selector concepts covered in CSS Basics. Besides the common ways to select elements with type, ID and class selectors, we're able to target elements based on their attributes, position in the HTML document, even their relation to other elements. By the end of this course, you'll have gained a better understanding of the power and flexibility behind CSS selectors. You'll have a new set of valuable tools in your CSS toolkit to use on your next project.
-
Course
- 1
- 2
- 3
- 4
- 5
Modular CSS with Sass
Today’s websites and applications are larger than ever and a lot hinges on the CSS architecture. CSS that is poorly thought-out can be a strain on development and maintenance in the long run. In this course, we're going to build a UI toolkit using many of the best practices and principles of modular CSS architecture. We'll learn how a modular approach with Sass can boost our workflow and cut down maintenance by reducing the amount of code we write. It can also improve how our code scales because we're able to reuse it on other parts of our project.
-
33 minWorkshop
CSS Best Practices
There’s more to writing good CSS than simply knowing all the latest and greatest features and techniques. In this workshop, we'll cover best practices for making our CSS more efficient, maintainable, and scalable.
Viewed