× {{alert.msg}} Never ask again

JavaScript Framework Series
March - May, 2015

20+ Free Online Office Hours with Experts in AngularJS, React, Backbone, Ember, Meteor, and More

AngularJS
AngularJS
React
React
Javascript
Javascript
Ember.js
Ember.js
Register Now - FREE

Sign up to RSVP for Office Hours - Free

Sign up to RSVP for JavaScript Free Office Hours Series and get notified for new tutorials!

Everything You'd Ever Want to Learn About JavaScript & Front-end Technologies

Codementor is proud to present JavaScript Framework Office Hours Series - an online event where we invite experts in AngularJS, React, Backbone.js, Ember.js, Meteor and more to host live office hours & free online courses to answer all of your questions.

Office Hours
Free Online Sessions
Tutorials
Free Resources
March
Geoff Goodman
Angular & Plunker

Geoff Goodman is the creator of Plunker, which is an entirely Angular-built way to support...you guessed it, Angular projects! The real-time previews and strong sense of feedback has made Plunker a very popular online community for creating, collaborating on and sharing web development ideas. ...

Mon, Mar
9
11:00 AM (PST)
Jack Franklin
Introduction to ES6 with Jack Franklin

Continuing with our March-theme of "Javascript Framework Month", we'll be taking a look at ES6. ES6, often referred to as “Harmony”, is the sixth major release of the ECMAScript language specification. ECMAScript is the “proper” name for the language commonly referred to as JavaScript. In ...

Wed, Mar
11
11:00 AM (PST)
Gleb Bahmutov
Using Angular to Improve Page Responsiveness with Dr. Gleb Bahmutov, PhD

Browser freezes while the digest cycle runs. What if we could keep our angular application the same but offload the digest cycle to separate thread in a web worker? Well, we can! Gleb published the step by step micro angular example that makes it possible in the blog post http://bahmutov.calepin...

Fri, Mar
13
11:00 AM (PST)
Urigo
Office Hours with "angular-meteor" creator Uri Goldshtein

Meteor 1.0 has just been released and the great power it gives to programmers is incredible. As a hard core AngularJS developer I wasn't so happy with Meteor’s choice to invent a new templating engine called Blaze. Researching into Meteor’s code I've learned more about the philosophies behind th...

with Urigo
Fri, Mar
20
11:00 AM (PST)
Zach Nation
Scalable Data Visualization in React.js

This talk will go in-depth about the use of React.js for visualization. We will discuss various techniques for rendering, and the pros and cons of each, including: render targets (canvas vs. SVG), client-server application architecture optimized for large data, and integration with other visuali...

Mon, Mar
23
11:00 AM (PST)
Rebecca Murphey
Apps that Talk Back - Monitoring the Performance and Behavior of Large Client-Side Javascript Applications

Rebecca Murphey is a staff software engineer at Bazaarvoice, where she leads a team that shepherds third-party JavaScript application development for products with a reach of hundreds of millions of visitors across billions of pageviews. She'll be discussing Client-Side JS Apps and having the...

Wed, Mar
25
11:00 AM (PST)
Marco Otte-Witte
An Overview of Ember Simple Auth by its Author, Marco Otte-Witte

In this session we'll be meeting with Marco Otte-Witte who authored Ember Simple Auth. He'll be giving us an overview of how the tool works, give us an example of using the app in action, and answer your questions! Marco is the founder and owner of simplabs, an Engineering and Consulting Agen...

Fri, Mar
27
12:00 PM (PST)
April
Martin Gontovnikas
Reactive all the things

Angular is performant enough for most apps, most of the time; But what happens when you're trying to push every drop of performance out of your browser app? Making your Webapp performant and at the same time have nice, loosely coupled code based on resauble blocks is extremely hard. How would...

Wed, Apr
1
11:00 AM (PST)
Nick Van Weerdenburg (Office Hours)
Building An Angular Hack Stack with Nick Van Weerdenburg

Learn how to work with bad or no APIs, temporary servers, and totally-test-driven approaches - in short, how to build a hack stack for quickly getting your AngularJS project off the ground without being handcuffed by your backend. Nick Van Weerdenburg is the Founder of rangle.io, a full-stack...

Wed, Apr
8
11:00 AM (PST)
Alexandre COLLIN
Leveraging Search to Build an Engaging User Experience, with Alexandre Collin of Algolia

Google and Amazon changed the rules of the search game, making it the default style of interaction on the Web. Yet implementing a fast and reliable site search has been challenging for decades. Nobody could build a search like Google and Amazon. Many developers convinced themselves that it was n...

Mon, Apr
13
11:00 AM (PST)
Kent C. Dodds
Learning Angular-Formly with Kent C. Dodds

Angular-Formly, a library created by Kent C. Dodds utilizes Angular to create dynamic forms. We'll be learning how to implement them ourselves with Kent on 4/15, RSVP soon! Kent C. Dodds is big into AngularJS and NodeJS especially, and loves GitHub. He has more AngularJS experience than most ...

Wed, Apr
15
11:00 AM (PST)
Matthew Beale
Intro to Ember.js - Building a Basic App

In this session we'll be getting an introduction to Ember.js and learn how to use it to build a basic web application. Matthew is a member of the Ember.js Core Team, author of an early book on Ember, and writes at madhatted.com. Through a consulting partnership named 201 Created, he's worked ...

Wed, Apr
22
11:00 AM (PST)
Brenda Jin (Office Hours)
Jasmine Testing for Backbone.js Models and Views with Brenda Jin

Behavior-driven development with Jasmine testing enables developers to create thoughtful software design. Testing helps us match code to expectation, and communicates our intentions to other developers. When coupled with Backbone.js, Jasmine can become a powerful tool in ensuring the scalability...

Fri, Apr
24
11:00 AM (PST)
Ilya Zayats
Creating SVG with React, with Ilya Zayats of Redbooth

React gives you a way to generate HTML and diff it very effectively on the client and on the server, but can we expand that functionality on SVG? Yes, we can do that and I will show you how to generate crispy graphs and scalable graphics with React in isomorphic manner. Ilya Zayats is a senio...

Mon, Apr
27
11:00 AM (PST)
May
Michael Klein
Using ember-cli-deploy to deploy Ember Apps, with one of its maintainers, Michael Klein

ember-cli-deploy aims to be the go-to-solution for deploying all Ember-CLI apps. In this session, Michael Klein, who is one of its maintainers, will join us to discuss using it to deploy any type of Ember App. This session will be a great continuation of our Javascript Framework Series, RSVP ...

Fri, May
1
11:00 AM (PST)
Yuri Takhteyev
Test-driven development in AngularJS with Yuri Takhteyev of Rangle.io

In this session we'll be learning a series of Unit Tests to implement TDD in AngularJS. We'll discuss modular code, AngularJS services, and other modules not entangled with DOM. From Yuri's bio: I started writing code sometime in the mid 1980s using MK-61 and rarely stopped since. I went o...

Tue, May
19
11:00 AM (PST)
Sam Selikoff
Testing in Ember with Sam Selikoff

In this session we'll be meeting with the creator of ember-cli-mirage, Sam Selikoff. Sam will be walking us through testing in ember, what solutions are available, and why he made Mirage + what problems it solves. Sam is a front-end developer at TEDTalks. ...

Wed, May
20
11:00 AM (PST)
Andrew Connell (Office Hours)
Building SPAs with Angular for Office 365, SharePoint Online & SharePoint 2013 On-Premises

SharePoint enables developers to create two different kinds of apps: cloud apps and SharePoint-Hosted Apps. The latter type, SharePoint-Hosted Apps, mean that the majority, if not all, of the application runs within the client. In this talk you’ll learn how to build a SharePoint-Hosted Applicati...

Wed, May
27
11:00 AM (PST)
React

React vs AngularJS – How the two Compare

The purpose of this article is to go over building some simple functionality using Angular and React to give you an understanding as to what it would take to get an application off the ground. Angular is the big dog in this fight, as it’s been around for a while longer than React has, but React brings increased rendering performance to the table. This post is not meant as an in-depth tutorial on either of the frameworks. As such, I’m not going to go into great detail for a lot of this...

Chris Harrington JavaScript · AngularJS · React {{showDate(1465985560)}}

React vs Angular 2: Comparison Guide for Beginners

At the time of writing, it becomes more and more difficult for beginners to choose a JavaScript framework to use for their project, or even to start learning. Every day, we hear new systems, approaches, and tools to make things easier. Some tools bundle, minify, abstract, hide, log, debug, and interact more directly to the DOM. Each one has their uses, but they also contribute to the JavaScript fatigue — the (too) many tools in the JavaScript world only make learning and using it feel more...

Codementor Team AngularJS {{showDate(1480498437)}}
AngularJS

Build Custom Directives in Angular 2

Directives are the most fundamental unit of Angular applications. As a matter of fact, the most used unit, which is a component, is actually a directive. Components are high-order directives with templates and serve as building blocks of Angular applications. How to write components in Angular 2 is everywhere on the web so we are not talking about that today. What we will be exploring today is Angular 2’s directives; types, when to use them, and how to build one for our custom needs. Types...

Building a Pokedex with React

What if Pokémon were real? As a kid growing up in the 90s, we’ve all wondered about this; catching Pokémon, battling in gyms, and using that cool Pokédex to give us the information we need. Obviously, there are no Pokémon in real life (Pokémon Go is the closest thing we can get to “real”) but that doesn’t mean we can’t have a cool Pokédex, right? So let’s build our own Pokédex using React! (Read related article: What if Programming Languages were Pokémon?) React.js Library Facebook has...

Bhargav JavaScript · React · Pokedex {{showDate(1479286384)}}
JavaScript

The Ultimate JavaScript Cheat Sheet

This is a quick overview of the JavaScript language. Reading this from the beginning to end is good, but going to a specific section is good as well. These days JavaScript runs on browsers, servers, powers command line tools, and more. In this cheat sheet, we will include a couple of browser features you can access with JavaScript on the client side and platform-agnostic features you can use either on the client or server. (READ MORE: JavaScript Best Practices: Tips & Tricks to Level Up...

Ionică Bizău (Johnny B.) Es6 · Cheatsheet {{showDate(1480408569)}}

How to Build Offline-smart Web Apps with Hoodie

In this tutorial, I’m going to show you how to build an application that works both online and offline (when the user is disconnected from the internet) with Hoodie. Introduction to Hoodie Hoodie is an open-source library that provides out-of-the-box syncing and offline capability. With Hoodie, you can quickly build web apps without worrying about the back-end, and out-of-the-box offline capabilities. Hoodie abstracts away the back-end and provides a friendly API for you to use within your...

JavaScript

Custom Infobox Labels with Google Maps Places API

##Introduction Many companies are interested in finding out how many of a certain business-type, competitor, supplier, or otherwise, might be in a particular area. Or maybe you’re making an app and you only want users to see information about nearby parks. If the area being searched is relatively small (one or two cities), the Google Places API is a great choice for querying businesses and other local locations. It is a bit complex to implement this in a lot of specific details, but getting...

Victor Gerard Temprano Google maps api 3 · Maps {{showDate(1476781496)}}
JavaScript

Build a Reusable JavaScript Library

Why you need to create a custom library One great quality of a top developer is the ability to do more with less—ranging from variable declarations to optimizing and refactoring a code to make a function block that takes specific values and returns the desired output. When you work on multiple projects, you begin to see patterns in the code that you write, features that you use often, those you rarely use, and those you never use. Things like AJAX requests and manipulating DOM elements seem...

Chimeremeze Ukah JavaScript · Library {{showDate(1479452503)}}
JavaScript

Getting Started with Vue.js: Why Use it?

Vue.js is yet another JavaScript UI library that is making waves and has growing support from the community. If you have an upcoming project and are wondering which tool to choose, you can give Vue a try. Vue is considerably easy to learn and you can get started with it in just 10 minutes (actually, that is what this article is going to help you do). But first, let’s have a quick look at why you should even give Vue a try. Read more: Skills JavaScript Developers Should Learn in 2016 Why use...

Christian Nwamba JavaScript {{showDate(1477039809)}}
JavaScript

Acceptance Testing in JavaScript with Cucumber.js & WebdriverIO

When it comes to testing your JS code, it is of utmost importance that you include acceptance tests apart from unit tests. This is where tools like Selenium or PhantomJS come into play. These tools help us run tests against our JS code in a real browser. If we put in a bit of effort, we can run those on multiple devices or platforms using services like Sauce Labs or BrowserStack. Enter WebdriverIO!! WebdriverIO lets you write tests, with actions through which you can control the browser and...

Jeremy Rajan JavaScript · Cucumberjs · Webdriverjs {{showDate(1476714885)}}
JavaScript

Module Bundling with Webpack: Getting Started Guide

In the wake of React—Facebook’s UI library—came Webpack, a simple but awesome module bundler. Module bundlers are just what they are called, they bundle up JavaScript modules into one file. This way, when the client makes a request to your server, it doesn’t have to make multiple requests for static files. Instead, one file is requested, which in some cases, includes your JavaScript bundle and CSS style. This helps optimize load time and makes you more in control as you can choose to include...

Chimeremeze Ukah JavaScript {{showDate(1477544596)}}
AngularJS

Create a Trello Clone using Angular, Node.js, Mongo, and Express

Table of contents I. Introduction II. Background A. Node.js B. Express C. Mongo D. Angular E. They are all JavaScript III. Let’s build a Trello clone Step 0: Getting started Step 1: Managing tickets on a board A. Create the “board” page B. Common mistakes so far Problem 1: I did not define a default route Problem 2: I forgot to include a .js file C. Painting the tickets D. Adding color and layout Step 2: Adding list and ticket functionality Step 3: Testing time A. Lists are not...

AngularJS {{showDate(1476357450)}}
PHP

Learn a New Language: Migrating from JavaScript to PHP

Introduction Once you’ve learned one programming language, it’s usually easier to learn another—at least conceptually. It can get frustrating, however, when what works well in your first language doesn’t work at all, or worse, works differently than you expect in your new language. If you know JavaScript and HTML pretty well, but not PHP, this tutorial will help you migrate your existing JavaScript knowledge to PHP more easily. I will help you leverage what you already know by comparing...

David Brumbaugh JavaScript · Migration · PHP {{showDate(1479876568)}}
React

Handling AJAX in your React Application with Agility

The React ecosystem has become huge since Facebook made the API public. More so, great libraries have been built in the declarative style adopted by React. However, real life applications require making AJAX requests to servers. And this can pose a great challenge while using React. You need to know what library to use for your AJAX processes. It’s good to know that there are different ways to handle AJAX with React. This is one of the beauties of React as a VIEW...

Rowland Ekemezie React · Redux · JavaScript {{showDate(1475227452)}}
JavaScript

Understanding "This" in JavaScript

Conceptual Overview of “this” When a function is created, a keyword called this is created (behind the scenes), which links to the object in which the function operates. The this keyword’s value has nothing to do with the function itself, how the function is called determines this’s value Default “this” context // define a function var myFunction = function () { console.log(this); }; // call it myFunction(); What can we expect the this value to be? By default, this should always be...

Dario Garcia Moya This · Beginner {{showDate(1475055289)}}
AngularJS

Migrating from Angular 1.x to Angular 2: Upgrade Strategies

Angular 2.0 has just been officially released! As of this writing, Angular 2 is in its final release version and sooner or later, all applications built in Angular 1.x will be required to be migrated to version 2 in order to be in sync with the latest Angular technology. The new Angular framework is a complete re-write of the existing Angular 1.x framework and will not be backward-compatible with the applications built in previous versions. What could be the reason behind re-writing an...

AngularJS {{showDate(1474358751)}}
JavaScript

Running Asynchronous JavaScript Code in Sequence with Async Waterfall

This is originally posted by the author on this blog. This version has been edited for clarity and some parts may appear different from the original post. ##Introduction Async is a JavaScript library that allows you to control the flow of asynchronous JavaScript code. In this tutorial we are going to explore the Async.waterfall method to run asynchronous functions “in-order”. Project Files Click here to download the project files. Make sure to run npm install before running node...

Amin Meyghani (AJ) JavaScript {{showDate(1475478028)}}
JavaScript

From 0 to 9: The Magic of Numbers in JavaScript

Numbers have a hidden power. Sometimes they are used in powerful forms of sorcery—just like in JavaScript. And as long you use them the right way, numbers can be a source of lot of fun in learning JS. 🤓 Note: I’m going to use ES2015 in the following examples. Not all will work natively everywhere (you need a ES2015 supported interpreter, but don’t worry probably you don’t have to take care of that; you probably have it already). Some of the examples are ES2015 specific. In that case, there...

AngularJS

How to Bundle Angular 2 with Rollup

Tools like Browserify and Webpack have been fairly popular among UI engineers to bundle their source code. Rollup is fairly new—and honestly a breath of fresh air after moving my Angular 2 source code from Alpha to RC. Along the way I tried every option to make a stable development and production environment from using Gulp, SystemJS, JSPM, Angular CLI and then Webpack, and now Rollup. In this article, I will share my findings and walk you through the start code project I built. Hopefully,...

AngularJS

Fetching Data from an API

For simple backend interactions, the $http module lets us do simple HTTP calls to an API end point. $http can be used for small, one-off HTTP requests. The $http service is a core Angular service that facilitates communication with the remote HTTP servers, via the browser’s XMLHttpRequest object or via JSONP. DIRECTIONS Create the HttpService service in app.js with a function getPost that will make an $http call to get a post: .controller('AppCtrl', function($scope)...

Sasha Nike Json · Fetch {{showDate(1471935298)}}
JavaScript

== vs === JavaScript: Double Equals and Coercion

The == (double equals or loose equality) operator is an interesting operator. Many avoid it because they don’t know how it works. But that’s not a good reason to avoid it; a better reason would be knowing how it works, and knowing why you want to avoid it. And then you will know why you prefer the === (triple equals) operator for comparisons. After reading this article, you will know all you need to know about coercion and double equals in JavaScript. Let’s get started! Double Equals The...

Amin Meyghani (AJ) JavaScript · Coercion {{showDate(1479889823)}}
About Codementor

Codementor is the open marketplace for both instant 1:1 help and long-term mentorship. Whether you’re trying to master new programming languages, learn web design, or working to become a better developer, you can get live 1:1 help from expert developers on Codementor.

Watch Video SIGN UP NOW - FREE
RSVP Now and Get Notified for New Tutorials
Help Spread the Word