Node Program is ideal for people new to Node, and for those who can use some help with JavaScript itself (stuff like “this”, prototype, var, etc.). In the first few lectures, I cover JavaScript fundamentals. Here’s a video of the beginning of one of the previous Node Program trainings: http://youtu.be/JPdTOJXG-hQ. It’s 19 minutes and a part of a six-hour self-study online course.
Category: Education
Pro Express.js Q&A (Recording)
Last week, I did a live Q&A session for people who bought my new book Pro Express.js, but you can watch the recording here. Click on the apps icon (next to the ? icon), and then click on the Q&A button to see the questions. If you haven’t bought Pro Express.js, then you can do it on Amazon.com… and start mastering the framework for you Node.js web development.
PS: You can also watch the session on YouTube, but I recommend Google +.
Here is the summary of questions and answers which you can also get in a PDF —>>> Pro Express.js Q&A, or read below.
Sails.js 101
Sails.js (GitHub) is a convention-over-configuration type of a framework. This means that it’s similar in philosophy to Ruby on Rails. Sails.js is a true MVC framework, unlike Express.js which relies on developers for adding ORMs like Mongoose. Sails.js uses the Waterline ORM.
Time to Up Your Node.js Skills
Are you a software engineer who wants to master an effective and fun-to-use, new platform Node.js? Is your goal to stay on top of the curve with cutting-edge technology, and to stay ahead of the competitive software engineering industry by delivering high quality products faster?
Node Program Announcement: Intensive Node.js, MongoDB and Express.js Course in The Bay Area
We’re glad to announce intensive Node.js, MongoDB and Express.js course in the Bay Area — Node Program.
The July 2014 course has only 10 seats (only 10 students!), and the registration will be open from 6/11/2014 9am PT to 07/21/2014 11:30pm PT.
If you would like to get updates about Node Program, sign up for our email list.
WHAT IS NODE PROGRAM?
Node Program is the fastest and most engaging way to get started with Node.js, MongoDB and Express.js. It’s an intensive weekend-long live course taught in the Bay Area by skilled experts who have run Node.js in production for years! Node Program is the ultimate way to get up and running with the foundations of Node.js, by learning the required foundational skills to use Node.js!
NODE PROGRAM HIGHLIGHTS
- Engaging: Live experience learning from instructors, mentors and peers
- Customized: Uniquely tailored to your needs; treat us as your consultants and coaches!
- Convenient: One weekend (16h), no need to take PTO or travel (Bay Area)
- Limited: Only 10 seats in each course; students undergo application process to insure they get the maximum out of the program and plenty of individualized attention
- Exclusive: The course will be repeated only 6 times
- Tested: Instructors have years of practical experience with Node.js and materials have been carefully developed and tested for success
- Practical: Students will walk out with multiple Node.js apps (projects)
- Transferable: Node Program is non-refundable because we want 100% commitment from students; but in the case of unforeseen circumstances you can transfer registration to another person before the deadline.
For more information, go to the event page.
CoffeeScript FUNdamentals: The Better JavaScript
Disclaimer: This text is a part of the JavaScript and Node FUNdamentals: A Collection of Essential Basics ebook which is available now for free. However, upon the book’s completion it’ll be priced at $2.99. The book is 80% done as of this writing. The formats available: PDF, EPUB and Kindle. If you would like to participate in the writing process by providing your feedback and future topics, fill this short Future Topics and Feedback form.
Continue reading “CoffeeScript FUNdamentals: The Better JavaScript”
Invest in Yourself
In the modern society, it’s not enough anymore just to graduate from a four-year college, and hope the skills and education acquired there will get you through the next 30–40 years of professional life. This is very prominent in software and technology fields, but applicable to many other industries as well.
In the age of the information workers, just to stay competitive on the market place, we constantly need to re-invent or jobs and ourselves. However, not everybody is happy about it. I often find people who don’t read professional books, magazines, blogs, and don’t learn outside of the job duties. Wake up people!
It’s so easy. MOOCs and online courses like Udemy and CreativeLive provide affordable interactive education. Free online ebooks are everywhere. Pick up a new language like Node.js or build something cool with React.
It’s no surprise that tomorrow, these people might be the first to be left on the outskirts of professional world . And when this happens, whom they’ll blame?
JS FUNdamentals: An Essential Overview of JavaScript
Programming languages like BASIC, Python, C has boring machine-like nature which requires developers to write extra code that’s not directly related to the solution itself. Think about line numbers in BASIC or interfaces, classes and patterns in Java.
On the other hand JavaScript inherits the best traits of pure mathematics, LISP, C# which lead to a great deal of expressiveness (and fun!).
More about Expressive Power in this post: What does “expressive” mean when referring to programming languages?
If it’s not fun, it’s not JavaScript.
Note: This text is a part of upcoming ebook JavaScript and Node FUNdamentals: A Collection of Essential Basics.
Expressiveness
Programming languages like BASIC, Python, C has boring machine-like nature which requires developers to write extra code that’s not directly related to the solution itself. Think about line numbers in BASIC or interfaces, classes and patterns in Java.
Continue reading “JS FUNdamentals: An Essential Overview of JavaScript”
Biggest Challenges Before Joining a Coding Bootcamp
Perception about what being a software engineer means is probably one of the biggest challenges to overcome before joining a coding bootcamp.
Perception
Perception about what being a software engineer means is probably one of the biggest challenges to overcome before joining a coding bootcamp. For decades, software engineers were perceived as scientists that require extensive education and dedication to the field. They would work on huge mainframes, programmed using punch cards and had to read whole programming language manuals before writing their first lines of code.
The world has changed since then. We have faster and cheaper computers and better developer tools, including high-level and very expressive languages like JavaScript/Node.js. For people thinking about coding bootcamp, these are all things to consider.
Continue reading “Biggest Challenges Before Joining a Coding Bootcamp”
You Dropped 150k on a Fucking Education?
For those who aren’t familiar with the context of this quote here is a meme. The meaning is simple: why spend in the magnitude of $150,000 on professional knowledge that is available virtually for free thanks to the Internet?
Choosing a Full Time Programming Course as a Career Change
For those who aren’t familiar with the context of this quote here is a meme. The meaning is simple: why spend in the magnitude of $150,000 on professional knowledge that is available virtually for free thanks to the Internet?
Cisco, Node.js and other musings
The hands-on Introduction to Node.js training consisted of two days and started badly: I was late driving from Oakland to San Jose through traffic, and security personnel in the lobby took extra 15 minutes to clear and escort me to the classroom. Nevertheless, attendees quickly plunged into installing Node.js, Node Package Manager and MongoDB using hard copies of Rapid Prototyping with JS: Agile JavaScript Development that I brought with me.
The Factory of Good Habits
Recently, I’ve read two great books about habits and it struck me: the difference between senior and junior software engineers is not only in the size of their paycheck; most importantly it’s in their habits!
Recently, I’ve read two great books about habits and it struck me: the difference between senior and junior software engineers is not only in the size of their paycheck; most importantly it’s in their habits!
Intro to Express.js: Parameters, Error Handling and Other Middleware
Express.js is a node.js framework that among other things provides a way to organize routes. Each route is defined via a method call on an application object with a URL patter as a first parameter (RegExp is also supported). The best practice is to keep router lean and thin by moving all the logic into corresponding external modules/files. This way important server configuration parameters will be neatly in one place, right there when you need them! :-)
Note: This text is a part of Express.js Guide: The Comprehensive Book on Express.js.
Express.js is one of the most popular and mature Node.js frameworks. You can read more about in Intro to Express.js series on webapplog.com:
- Intro to Express.js: Simple REST API app with Monk and MongoDB
- Node.js MVC: Express.js + Derby Hello World Tutorial
To learn how to create an application from scratch please refer to the earlier post.
Request Handlers
Express.js is a node.js framework that among other things provides a way to organize routes. Each route is defined via a method call on an application object with a URL patter as a first parameter (RegExp is also supported), for example:
app.get('api/v1/stories/', function(res, req){
...
})
or, for a POST method:
app.post('/api/v1/stories'function(req,res){
...
})
It’s needless to say that DELETE and PUT methods are supported as well.
The callbacks that we pass to get()
or post()
methods are called request handlers, because they take requests (req
), process them and write to response (res
) objects. For example:
app.get('/about', function(req,res){
res.send('About Us: ...');
});
We can have multiple request handlers, hence the name middleware. They accept a third parameter next
calling which (next()
) will switch the execution flow to the next handler:
app.get('/api/v1/stories/:id', function(req,res, next) {
//do authorization
//if not authorized or there is an error
// return next(error);
//if authorized and no errors
return next();
}), function(req,res, next) {
//extract id and fetch the object from the database
//assuming no errors, save story in the request object
req.story = story;
return next();
}), function(req,res) {
//output the result of the database search
res.send(res.story);
});
ID of a story in URL patter is a query string parameter which we need for finding a matching items in the database.
Parameters Middleware
Parameters are values passed in a query string of a URL of the request. If we didn’t have Express.js or similar library, and had to use just the core Node.js modules, we’d had to extract parameters from HTTP.request object via some require('querystring').parse(url)
or require('url').parse(url, true)
functions trickery.
Thanks to Connect framework and people at VisionMedia, Express.js already has support for parameters, error handling and many other important features in the form of middlewares. This is how we can plug param middleware in our app:
app.param('id', function(req,res, next, id){
//do something with id
//store id or other info in req object
//call next when done
next();
});
app.get('/api/v1/stories/:id',function(req,res){
//param middleware will be execute before and
//we expect req object already have needed info
//output something
res.send(data);
});
For example:
app.param('id', function(req,res, next, id){
req.db.get('stories').findOne({_id:id}, function (e, story){
if (e) return next(e);
if (!story) return next(new Error('Nothing is found'));
req.story = story;
next();
});
});
app.get('/api/v1/stories/:id',function(req,res){
res.send(req.story);
});
Or we can use multiple request handlers but the concept remains the same: we can expect to have req.story
object or an error thrown prior to the execution of this code so we abstract common code/logic of getting parameters and their respective objects:
app.get('/api/v1/stories/:id', function(req,res, next) {
//do authorization
}),
//we have an object in req.story so no work is needed here
function(req,res) {
//output the result of the database search
res.send(story);
});
Authorization and input sanitation are also good candidates for residing in the middlewares.
Function param()
is especially cool because we can combine different keys, e.g.:
app.get('/api/v1/stories/:storyId/elements/:elementId',function(req,res){
res.send(req.element);
});
Error Handling
Error handling is typically used across the whole application, therefore it’s best to implement it as a middleware. It has the same parameters plus one more, error
:
app.use(function(err, req, res, next) {
//do logging and user-friendly error message display
res.send(500);
})
In fact, the response can be anything:
JSON string
app.use(function(err, req, res, next) {
//do logging and user-friendly error message display
res.send(500, {status:500, message: 'internal error', type:'internal'});
})
Text message
app.use(function(err, req, res, next) {
//do logging and user-friendly error message display
res.send(500, 'internal server error');
})
Error page
app.use(function(err, req, res, next) {
//do logging and user-friendly error message display
//assuming that template engine is plugged in
res.render('500');
})
Redirect to error page
app.use(function(err, req, res, next) {
//do logging and user-friendly error message display
res.redirect('/public/500.html');
})
Error HTTP response status (401, 400, 500, etc.)
app.use(function(err, req, res, next) {
//do logging and user-friendly error message display
res.end(500);
})
By the way, logging is also should be abstracted in a middleware!
To trigger an error from within your request handlers and middleware you can just call:
next(error);
or
next(new Error('Something went wrong :-(');
You can also have multiple error handlers, and use named instead of anonymous functions as its shows in Express.js Error handling guide.
Other Middleware
In addition to extracting parameters, it can be used for many things, like authorization, error handling, sessions, output, and others.
res.json()
is one of them. It conveniently outputs JavaScript/Node.js object as a JSON. For example:
app.get('/api/v1/stories/:id', function(req,res){
res.json(req.story);
});
is equivalent to (if req.story
is an Array and Object):
app.get('/api/v1/stories/:id', function(req,res){
res.send(req.story);
});
or
app.get('api/v1/stories/:id',function(req,res){
res.set({
'Content-Type': 'application/json'
});
res.send(req.story);
});
Abstraction
Middleware is flexible. You can use anonymous or named functions, but the best thing is to abstract request handlers into external modules based on the functionality:
var stories = require.('./routes/stories');
var elements = require.('./routes/elements');
var users = require.('./routes/users');
...
app.get('/stories/,stories.find);
app.get('/stories/:storyId/elements/:elementId', elements.find);
app.put('/users/:userId',users.update);
routes/stories.js:
module.exports.find = function(req,res, next) {
};
routes/elements.js:
module.exports.find = function(req,res,next){
};
routes/users.js:
module.exports.update = function(req,res,next){
};
You can use some functional programming tricks, like this:
function requiredParamHandler(param){
//do something with a param, e.g., check that it's present in a query string
return function (req,res, next) {
//use param, e.g., if token is valid proceed with next();
next();
});
}
app.get('/api/v1/stories/:id', requiredParamHandler('token'), story.show);
var story = {
show: function (req, res, next) {
//do some logic, e.g., restrict fields to output
return res.send();
}
}
As you can see middleware is a powerful concept for keeping code organized. The best practice is to keep router lean and thin by moving all the logic into corresponding external modules/files. This way important server configuration parameters will be neatly in one place, right there when you need them! :-)
Rapid Prototyping with JS Update v0.4
Why Backbone.js? Because a lot of people expressed desire to use it but being a framework Backbone has a learning curve. Not a steep one like Rails but still it takes time to master and learn Backbone. The new chapter “Intro to Backbone.js” will show readers how to:
- Create Backbone architecture from scratch
- Construct proper architecture with Routes
- Use Collections
- Apply Templates in Subviews
- Split code into multiple JS files
- Organize code into modules with AMD and Require.js
- Optimize code for production with r.js library
Link to the new copy of Rapid Prototyping with JS at https://leanpub.com/rapid-prototyping-with-js.
TL;DR
Here is a list of the update for Rapid Prototyping with JS v0.4:
- Brand new chapter: Intro to Backbone.js
- Re-structured table of contents (chapters and parts)
- Extended list of resources for further reading
- Fixed code formatting and highlighting
- Fixed grammar, style and typos mistakes
- Brand new book cover optimized for ebook format
- Reduced size of ebook (faster download)
- Inspirational quotes in each chapter
- Updated “Basics” chapter
- New headline “Agile JavaScript Development”
- Extended list of ways to reach us (Twitter, Facebook, Storify, etc.)
LeanPub Updates
LeanPub changed their purchasing. Now it’s even better for readers. Anybody can “return” the book they didn’t like within 45 days and get a full refund. Word return is in double quotes because all content is Digital Right Management (DRM) free. Does it mean that somebody can buy and download a book, get their money back, but keep the copy? Yes, but they will get bad karma for that! And not like a bad karma on Hacker News but a real bad karma. Everybody else deservers authors and publishers trust and respect.
Backbone.js
Why Backbone.js? Because a lot of people expressed desire to use it but being a framework Backbone has a learning curve. Not a steep one like Rails but still it takes time to master and learn Backbone. The new chapter “Intro to Backbone.js” will show readers how to:
- Create Backbone architecture from scratch
- Construct proper architecture with Routes
- Use Collections
- Apply Templates in Subviews
- Split code into multiple JS files
- Organize code into modules with AMD and Require.js
- Optimize code for production with r.js library
Write and follow @RPJSbook.
Test-Driven Development in Node.js With Mocha
Don’t waste time writing tests for throwaway scripts, but please adapt the habit of Test-Driven Development for the main code base. With a little time spent in the beginning, you and your team will save time later and have confidence when rolling out new releases. Test Driven Development is a really really really good thing.
Who needs Test-Driven Development?
Imagine that you need to implement a complex feature on top of an existing interface, e.g., a ‘like’ button on a comment. Without tests you’ll have to manually create a user, log in, create a post, create a different user, log in with a different user and like the post. Tiresome? What if you’ll need to do it 10 or 20 times to find and fix some nasty bug? What if your feature breaks existing functionality, but you notice it 6 months after the release because there was no test!
Don’t waste time writing tests for throwaway scripts, but please adapt the habit of Test-Driven Development for the main code base. With a little time spent in the beginning, you and your team will save time later and have confidence when rolling out new releases. Test Driven Development is a really really really good thing.
Quick Start Guide
Follow this quick guide to set up your Test-Driven Development process in Node.js with Mocha.
Install Mocha globally by executing this command:
$ sudo npm install -g mocha
We’ll also use two libraries, Superagent and expect.js by LeanBoost. To install them fire up npm commands in your project folder like this:
$ npm install superagent
$ npm install expect.js
Open a new file with .js
extension and type:
var request = require('superagent');
var expect = require('expect.js');
So far we’ve included two libraries. The structure of the test suite going to look like this:
describe('Suite one', function(){
it(function(done){
...
});
it(function(done){
...
});
});
describe('Suite two', function(){
it(function(done){
...
});
});
Inside of this closure we can write request to our server which should be running at localhost:8080:
...
it (function(done){
request.post('localhost:8080').end(function(res){
//TODO check that response is okay
});
});
...
Expect will give us handy functions to check any condition we can think of:
...
expect(res).to.exist;
expect(res.status).to.equal(200);
expect(res.body).to.contain('world');
...
Lastly, we need to add done() call to notify Mocha that asynchronous test has finished its work. And the full code of our first test looks like this:
var request = require('superagent');
var expect = require('expect.js');
describe('Suite one', function(){
it (function(done){
request.post('localhost:8080').end(function(res){
expect(res).to.exist;
expect(res.status).to.equal(200);
expect(res.body).to.contain('world');
done();
});
});
});
If we want to get fancy, we can add before and beforeEach hooks which will, according to their names, execute once before the test (or suite) or each time before the test (or suite):
before(function(){
//TODO seed the database
});
describe('suite one ',function(){
beforeEach(function(){
//todo log in test user
});
it('test one', function(done){
...
});
});
Note that before and beforeEach can be placed inside or outside of describe construction.
To run our test simply execute:
$ mocha test.js
To use different report type:
$ mocha test.js -R list
$ mocha test.js -R spec
Cheat Sheets for Web Development
Web development usually involves a large number of languages each with its own syntax, keywords, special sauce and magic tricks. Here is a collection of web development cheat sheets, in no particular order, which I’ve amassed by browsing the Internet over many years of web development
Cheat sheets are great ways to organize frequently used information and keep it handy. I used cheat sheets for learning and memorizing during my crams at school, and use them now for reference.
Web development usually involves a large number of languages each with its own syntax, keywords, special sauce and magic tricks.
Here is a collection of web development cheat sheets, in no particular order, which I’ve amassed by browsing the Internet over many years of web development. They cover the following topics:
- jQuery
- CSS3
- Git
- Heroku
- HTML5
- Linux Command Line
- Mod reWrite
- CoffeeScript
- JavaScript
- CSS2
- JavaScript DOM
- Mac Glyphs
- Node.js
- PHP
- RGB Hex
- Sublime Text 2
- SEO
- WordPress
Get zip archive at http://www.webapplog.com/wp-content/uploads/web-dev-cheat-sheets.zip.
Full list of the files:
jquery12_colorcharge.png
cdiehl_firefox.pdf
CSS Help Sheet outlined.pdf
css-cheat-sheet-v2.pdf
css-cheat-sheet.pdf
CSS3 Help Sheet outlined.pdf
css3-cheat-sheet.pdf
dan-schmidt_jquery-utility-functions-type-testing.pdf
danielschmitz_jquery-mobile.pdf
davechild_css2.pdf
davechild_html-character-entities.pdf
davechild_javascript.pdf
davechild_linux-command-line.pdf
davechild_mod-rewrite.pdf
davechild_regular-expressions.pdf
dimitrios_coffeescript-cheat-sheet.pdf
gelicia_sublime-text-2-shortcuts-verbose-mac.pdf
Git_Cheat_Sheet_grey.pdf
heroku_cheatsheet.pdf
HTML Help Sheet 02.pdf
html5-cheat-sheet.pdf
i3quest_jquery.pdf
javascript_refererence.pdf
javascript-cheat-sheet-v1.pdf
JavaScript-DOM-Cheatsheet.pdf
javascriptcheatsheet.pdf
jQuery-1_3-Visual-Cheat-Sheet.pdf
Mac_Glyphs_All.pdf
Node Help Sheet.pdf
PHP Help Sheet 01.pdf
pyro19d_javascript.pdf
rgb-hex-cheat-sheet-v1.pdf
salesforce_git_developer_cheatsheet.pdf
samcollett_git.pdf
sanoj_web-programming.pdf
SEO_Web_Developer_Cheat_Sheet.pdf
skrobul_sublime-text-2-linux.pdf
WordPress-Help-Sheet.pdf
Help Sheets.zip
Wintersmith — Node.js static site generator
This past weekend was a very productive one for me, because I’ve started to work on and released my book’s one-page website —rapidprototypingwithjs.com. I’ve used Wintersmith to learn something new and to ship fast. Wintersmith is a Node.js static site generator. It greatly impressed me with flexibility and ease of development. In addition I could stick to my favorite tools such as Markdown, Jade and Underscore.
This past weekend was a very productive one for me, because I’ve started to work on and released my book’s one-page website —rapidprototypingwithjs.com. I’ve used Wintersmith to learn something new and to ship fast. Wintersmith is a Node.js static site generator. It greatly impressed me with flexibility and ease of development. In addition I could stick to my favorite tools such as Markdown, Jade and Underscore.
Why Static Site Generators
Here is a good article on why using a static site generator is a good idea in general, An Introduction to Static Site Generators. It basically boils down to a few main things:
Templates
You can use template engine such as Jade. Jade uses whitespaces to structure nested elements and its syntax is similar to Ruby on Rail’s Haml markup.
Markdown
I’ve copied markdown text from my book’s Introduction chapter and used it without any modifications. Wintersmith comes with marked parser by default. More on why Markdown is great in my old post, Markdown Goodness.
Simple Deployment
Everything is HTML, CSS and JavaScript so you just upload the files with FTP client, e.g., Transmit by Panic or Cyberduck.
Basic Hosting
Due to the fact that any static web server will work well, there is no need for Heroku or Nodejitsu PaaS solutions, or even PHP/MySQL hosting.
Performance
There are no database calls, no server-side API calls, no CPU/RAM overhead.
Flexibility
Wintersmith allows for different plugins for contents and templates and you can even write you own plugin.
Getting Started with Wintersmith
There is a quick getting started guide on github.com/jnordberg/wintersmith.
To install Wintersmith globally, run NPM with -g and sudo:
$ sudo npm install wintersmith -g
Then run to use default blog template:
$ wintersmith new <path>
or for empty site:
$ wintersmith new <path> -template basic
or use a shortcut:
$ wintersmith new <path> -T basic
Similar to Ruby on Rails scaffolding Wintersmith will generate a basic skeleton with contents and templates folders. To preview a website, run these commands:
$ cd <path>
$ wintersmith preview
$ open http://localhost:8080
Most of the changes will be updates automatically in the preview mode except for the config.json file.
Images, CSS, JavaScript and other files go into contents folder.
Wintersmith generator has the following logic:
- looks for *.md files in contents folder,
- reads metadata such as template name,
- processes *.jade templates per metadate in *.md files.
When you’re done with your static site, just run:
$ wintersmith build
Other Static Site Generators
Here are some of the other Node.js static site generators:
More detailed overview of these static site generators is available in the post, Node Based Static Site Generators.
For other languages and frameworks like Rails and PHP take a look at Static Site Generators by GitHub Watcher Count and the “mother of all site generator lists”.
Rapid Prototyping with JS is out!
Rapid Prototyping with JS is a hands-on book which introduces you to rapid software prototyping using the latest cutting-edge web and mobile technologies including NodeJS, MongoDB, BackboneJS, Twitter Bootstrap, LESS, jQuery, Parse.com, Heroku and others.
The Book is on LeanPub
Rapid Prototyping with JS is a hands-on book which introduces you to rapid software prototyping using the latest cutting-edge web and mobile technologies including NodeJS, MongoDB, BackboneJS, Twitter Bootstrap, LESS, jQuery, Parse.com, Heroku and others.
The book has 84 pages (in PDF format) or 13,616 words to be precise, step-by-step set-up, best practice advices, web development overview, 11 code examples (also available ready-to-go in GitHub repository azat-co/rpjs), flexible pricing ($9.99–19.99).
Order your copy of Rapid Prototyping with JS at LeanPub: leanpub.com/rapid-prototyping-with-js.
LeanPub platform allows readers to receive infinite future updates (current version of the book is 0.3) and read the book in the most popular digital formats: PDF, ePub/iPad, MOBI/Kindle. The PDF version has footnote links which make it suitable for printing.
Download a free sample at samples.leanpub.com/rapid-prototyping-with-js-sample.pdf.
What Readers Say
Rapid Prototyping with JS is being successfully used at StartupMonthly as a training manual. Here are some of our trainees’ testimonials:
“Thanks a lot to all and special thanks to Azat and Yuri. I enjoyed it a lot and felt motivated to work hard to know these technologies.” — Shelly Arora
“Thanks for putting this workshop together this weekend… what we did with Bootstrap + Parse was really quick & awesome.” — Mariya Yao
“Thanks Yuri and all of you folks. It was a great session – very educative, and it certainly helped me brush up on my Javascript skills. Look forward to seeing/working with you in the future.” — Sam Sur
Who This Book is For
The book is designed for advanced-beginner and intermediate level web and mobile developers: somebody who has just started programming and somebody who is an expert in other languages like Ruby on Rails, PHP, and Java and wants to learn JavaScript and Node.js.
Rapid Prototyping with JS, as you can tell from the name, is about taking your idea to a functional prototype in the form of a web or a mobile application as fast as possible. This thinking adheres to the Lean Startup methodology. Therefore, this book would be more valuable to startup founders, but big companies’ employees might also find it useful, especially if they plan to add new skills to their resume.
Prerequisite
Mac OS X or UNIX/Linux systems are highly recommended for this book’s examples and for web development in general, although it’s still possible to hack your way on a Windows-based system.
Contents
Acknowledgment
Introduction
- Who This Book is For
- Prerequisite
- What to Expect
- Notation
- Web Basics: Hyper Text Markup Language, Cascading Style Sheets, JavaScript
- Agile Methodologies: Scrum, Test-Driven Development, Continuous Deployment, Paired Programming
- Node.js
- NoSQL and MongoDB
- Cloud Computing
- HTTP Requests and Responses
- RESTful API
Getting Started
- Development Folder
- Browsers
- IDEs and Text Editors
- Version Control Systems
- Local HTTP Servers
- Database: MongoDB
- Other Components: NodeJS, jQuery, LESS
- SSH Keys
- GitHub
- Windows Azure
- Heroku
- Cloud9
Building Front-End Application
- JSON
- AJAX
- Cross-Domain Calls
- jQuery
- Twitter Bootstrap
- LESS
- BackboneJS
- Example of using Twitter REST API and jQuery
- Parse.com
- Message Board with Parse.com
- Message Board with Parse.com: REST API and jQuery version
- Pushing to GitHub
- Deployment to Windows Azure
- Deployment to Heroku
- Message Board with Parse.com: JavaScript SDK and BackboneJS version
- Deploying Message Board to PaaS
- Enhancing Message Board
- Building Back-End Application
Building “Hello World” in NodeJS
- NodeJS Core Modules
- Node Package Manager
- Deploying “Hello World” to PaaS
- Deploying to Windows Azure
- Deploying to Heroku
- Message Board: Run-Time Memory version
- Test Case for Message Board
- MongoDB Shell
- MongoDB Native Driver
- MongoDB on Heroku: MongoHQ MongoHQ URL
- BSON
- Message Board: MongoDB version
Putting it All Together
- Different Domain Deployment
- Changing Endpoints
- Message Board Application
- Deployment
- Same Domain Deployment
Further Reading
About the Author
Order your copy of Rapid Prototyping with JS at LeanPub: leanpub.com/rapid-prototyping-with-js.
What We’ve Learned From Teaching the Trainings
A couple months ago, the team of StartupMonthly: Yuri Rabinovich and Vadim Slavin as instructors and facilitators, Micah McGraw as an assistant (thanks Micah!), and I as an instructor and author, ran another class of my Rapid Prototyping with JavaScript and NodeJS training.
The training is a two and a quarter day intensive hands-on workshop designed for advanced beginner and intermediate programmers. The main goal is to take an idea to a functional prototype, known as Minimal Viable Product or just MVP in Lean Startup circles.
We cover agile software and business methodologies (Lean Startup), front-end development with modern tools (LESS, Parse.com, Git) and frameworks (BackboneJS, jQuery, Twitter Bootstrap), deployment to production with Platform as a Service (PaaS) solutions (Heroku, Windows Azure) and back-end development with highly efficient and scalable technologies (Node.js, MongoDB). You can find the detailed curriculum of Rapid Prototyping with JavaScript training: on WebAppLog blog, and on StartupMonthly website.
We’ve learned a great deal from our students. Here are some of the most important, in my opinion, things:
- Trainees with different levels of programming skills have different interests and different questions. We had trainees who were asking questions about running NodeJS stack in production and on the other hand there were people who were struggling with basic examples, e.g., making AJAX JavaScript call.
- We still stayed competitive as a business venture even after reducing the discounts by $100 to $200, e.g., classes at Marakana are 1.5–2x more expensive; therefore rising prices don’t often affect the sales.
- Having more time to market and sell is more important than having a lower price per seat. We came to this conclusion when higher prices and two months marketing yielded better results than lower price and one month of marketing. The brand awareness of the training is still insignificant to account for it. We mostly used [StartupMonthly] network and social events, a couple hundreds of dollars on Facebook ads, posting on Hacker News, and emailing to JavaScript dev groups.
- Full refund policy didn’t turn out to be a disaster; in fact, it might have helped us to sell out the tickets. There was only one student who requested the refund simply because he didn’t expect that the training would be so intense and not suited for total beginners in web development.
- Setting up dev environment is not an issue with a good step-by-step manual. Thanks to the lessons we’ve learned from out previous training, more about it in this blog post — Pilot Rapid Prototyping with JavaScript and NodeJS Class, I had beefed-up the manual with more robust tutorials; and only 2 trainees showed up for our optional Friday night pre-course session to get help with setting up a development environment on their machines. This is a true Reverse teaching approach.
- Examples usually are not interesting to some of the students. We had a more engaging class when the students worked on their own ideas rather than code examples from the manual. Because examples are boring, people copy/paste code instead of writing it. Which leads to…
- Copy/paste students complete assignments faster, but some of them have no idea how basic stuff works :-( It came to no-surprise that those trainees experienced barrage of difficulties when they tried to work on their own ideas or to implement additional functionality on top of the examples provided in the manual.
- Advanced students skipped the second day, on which we had fun with NodeJS and MongoDB. Bummer! They were only interested in front-end JavaScript prototyping to complement their Ruby on Rails or Java back-end skills, hence the demand for separate front-end training exists.
Recently, I had a conversations with a new technical education company, Catalyst, which takes people from zero to employment; something similar to Dev Bootcamp but for JavaScript, including technologies like jQuery, CoffeeScript, NodeJS, etc.
We concluded that with materials widely available in a form of books, screencasts, GitHub repositories, and other mediums, learning technical skills come down to motivation. And motivation comes mostly from self-identity. For example, if I self-identify myself as a developer (or engineer, programmer, hacker), I could stay up all night fixing bugs, hacking around an obscure platform limitation, or trying to meet a deadline; however, if I wear an entrepreneurial hat, I’m more inclined to look at the bigger picture and either to defer the issue or to delegate it to a more experienced person. Therefore, entrepreneurial types usually less motivated to solve pure technical problems.
In our next iteration of the Rapid Prototyping with JavaScript and NodeJS trainings we plan to change our approach from education to coaching by:
- Extending the format from two days to three to four days;
- Accepting only those teams of two to three people or one-man-band-type individuals who already have an idea;
- Packaging training materials in a self-study kit starting with a Rapid Prototyping with JavaScript book.
Students will work on their ideas while tapping into mentorship and experience of industry leading practices in both technical and Lean Startup methodologies. Exact dates and location of the next trainings will be announced on StartupMonthly website and on my blog — WebAppLog.com.
Online Education Overview
Massive open online course or MOOC — is a type of online course aimed at large-scale participation and open access via the web. MOOCs are a recent development in the area of distance education, and a progression of the kind of open education ideals suggested by open educational resources.wiki
Up until recently, online courses were just poor imitations of traditional lectures captured on video camera. MOOCs emerged a few years ago with pioneers such as Coursera. They’ve become more and more popular as supplementary, continuing or even as a replacement for traditional education.
Free Online Courses
Here is a brief overview of free online courses:
- Udacity: high quality free courses consisting of short videos with quizzes, homework, tests, engaging discussions among faculty and students, multiple levels of certification, job board featuring student profiles.
- Coursera: same free high quality content as Udacity with broader selection of courses.
- edX: similar concept as Coursera or Udacity; edX courses involve professors from MIT, Harvard and other top-tier universities.
- Open Classroom: free online videos of Stanford University classes.
- CodeAcademy: ability to learn JavaScript (other languages like Ruby on Rails are coming soon!) in your browser with automated tests.
Other Free Online Courses
These courses like Open Classroom are less comprehensive than MOOCs and usually lack discussion boards, tests and certification:
- Academic Earth: free online classes and online learning tools from Ivy League universities, Massachusetts Institute of Technology, Stanford University, University of California at Berkeley and others.
- Open.Michigan: hub for openly licensed educational content initiated by the University of Michigan.
- webcast.berkeley: UC Berkeley’s central service for online video & audio for students and learners around the globe.
- Open Yale Courses: free and open access to a selection of introductory courses taught by distinguished teachers and scholars at Yale University.
- MIT OpenCourseWare: free publication of MIT course materials that reflect almost all the undergraduate and graduate subjects taught at MIT.
Paid Online Courses
These websites offer a wide variety of classes at relatively small cost:
- Udemy: lots of discounts; courses on Lean Startup methodology.
- Online Marketing Institute: all things related to online marketing; subscription-based.
- Khan Academy: short videos primarily on high school subjects.
- iTunes U: mostly videos and textbooks from top universities like Yale.
- Lynda: paid business and software-oriented courses with homework, labs and tests.
Degree Programs and Education
For those who need a degree, the online education approach offers greater flexibility than a conventional one; various degrees can be earned part-time, at your own location and at a cheaper cost. Here are the most trusted (and in most cases accredited) options:
- Kaplan University: more than 170 degrees and programs by an accredited institution.
- DeVry University: online degree programs at the associate, bachelor’s, and master’s degree programs level.
- Strayer: both online (called iCampus) and on-campus options with the same content and accreditation.
- University of Phoenix: 20 years of experience in online education with accreditation in degree programs at the associate, bachelor’s, master’s and doctoral levels.
Screencasts
A screencast is a digital recording of computer screen output, also known as a video screen capture, often containing audio narration.wiki
Screencasts have become a very popular learning tool for programmers and IT professionals. Here are some top screencast websites for cutting-edge technologies such as Ruby on Rails, JavaScript and NodeJS:
- Ruby on Rails screencasts: big subscription-based collection of RoR screencasts.
- Peep Code Screencasts: subscription-based website where you could choose from lots of technologies and frameworks, e.g., RoR, JS, NodeJS.
- ScreenCasts.org: emerging JavaScript screencast hub.
- Backbone Screencasts: all the things BackboneJS on a pay-as-you-go basis.
- NodeTuts: Node.js Free screencast tutorials for NodeJS.
Trends in Online Education
Here are some common hot trends which emerged in the past couple years in online education:
- Reversed classroom concept (aka Flip teaching): instructors give the bulk of new materials as a homework for self-study and leave precious time with students for Q&A, tests, discussions.
- Short videos: materials are easier to digest in short bursts, each usually followed by a quiz or summary.
- Low-tech, conversational tutorial videos without the instructor as in Khan Academy video format.
- Automation of tests: in-browser tests and even coding interpreters require less supervision from instructors.
- Peers’ help on discussion forums: students help each other to clarify questions, give hints, find goofs and mistakes, and provide out-of-the-box answers to the problems; therefore, these discussions help to save faculty’s precious time.
Not always the old pro-verb “you’re getting what you pay for it” is right. In the past decade, the cost of conventional education has skyrocketed due to easily available student loans but efficiency stayed pretty much the same. The general trend is that education and online education especially is getting more efficient. MOOCs allow dozens of thousands of students to partake in a single course. Although, there are many regulated professions such as ones in medical or law fields where traditional degrees are a necessity, for the vast majority of IT jobs, portfolios and GitHub “resumes” have become more important than GPAs or names of prestigious colleges in the hiring process. It might be too early to say what impact these initiatives will have on hiring especially in big (conservative) corporations, but with high motivation and great materials most people can achieve amazing results in study without getting into debt.
In conclusion, my personal favorite MOOC website is Udacity. I even bought a T-shirt to support them. Would you pay thousands dollars for almost the same quality of materials? I wouldn’t but then I already have Master’s Degree from traditional university :-) So are MOOCs only for continued education? What do you think?