From 0a83d803e5cfbfeebea59f9db1abb950b7a678dc Mon Sep 17 00:00:00 2001 From: Sahat Yalkabov Date: Mon, 27 Jan 2014 03:41:24 -0500 Subject: [PATCH 1/4] Add more client-side/Node libs, todo, screencast --- README.md | 13 ++++++++++++- 1 file changed, 12 insertions(+), 1 deletion(-) diff --git a/README.md b/README.md index a63218c0da..4ee7a001d3 100644 --- a/README.md +++ b/README.md @@ -49,6 +49,9 @@ Prerequisites > - Node.js > - **Xcode** (Mac OS X) or **Visual Studio** (Windows) +**Note**: If you are new to Node.js or Express framework, +I highly recommend watching [Node.js and Express 101](http://www.youtube.com/watch?v=BN0JlMZCtNU) screencast that teaches Node and Express from scratch. + Getting Started --------------- @@ -73,7 +76,7 @@ node app.js > **Note**: I strongly recommend installing nodemon `sudo npm install -g nodemon`. > It will monitor for any changes in your node.js > application and automatically restart the server. Once installed, instead of `node app.js` use `nodemon app.js`. -> It will be a huge time saver. +> It is a big time saver in the long run. Next up, if you want to use any of the APIs or OAuth2 authentication methods, you will need to obtain appropriate credentials: Client ID, Client Secret, API Key, or Username & Password. You will @@ -107,6 +110,7 @@ Obtaining API Keys - Select **Website** - Enter `http://localhost:3000` for *Site URL* +*TODO: Add Twitter and GitHub instructions.* Project Structure ----------------- @@ -145,6 +149,7 @@ Recommended Node.js Libraries - [geoip-lite](https://github.com/bluesmoon/node-geoip) - get location name from IP address. - [email.js](https://github.com/eleith/emailjs) - send emails with node.js (without sendgrid or mailgun). - [filesize.js](http://filesizejs.com/) - make file size pretty, e.g. `filesize(265318); // "265.32 kB"`. +- [Numeral.js](http://numeraljs.com) - a javascript library for formatting and manipulating numbers. Recommended Client-Side libraries --------------------------------- @@ -153,6 +158,12 @@ Recommended Client-Side libraries - [iCheck](https://github.com/fronteed/iCheck) - Custom nice looking radio and check boxes. - [Magnific Popup](http://dimsemenov.com/plugins/magnific-popup/) - Responsive jQuery Lightbox Plugin. - [jQuery Raty](http://wbotelhos.com/raty/) - Star Rating Plugin. +- [Headroom.js](http://wicky.nillia.ms/headroom.js/) - Hide your header until you need it. +- [Fotorama](http://fotorama.io) - Very nice jQuery gallery. +- [X-editable](http://vitalets.github.io/x-editable/) - Edit form elements inline. +- [Offline.js](http://github.hubspot.com/offline/docs/welcome/) - Detect when user's internet connection goes offline. +- [Color Thief](https://github.com/lokesh/color-thief) - Grabs the dominant color or a representative color palette from an image. +- [Alertify.js](http://fabien-d.github.io/alertify.js/) - Sweet looking alerts and browser dialogs. TODO ---- From 2019fa9067518dd9cb46bc7add3455d78dcd6757 Mon Sep 17 00:00:00 2001 From: Sahat Yalkabov Date: Mon, 27 Jan 2014 07:05:56 -0500 Subject: [PATCH 2/4] Update Project Strcuture --- README.md | 11 +++++++++-- 1 file changed, 9 insertions(+), 2 deletions(-) diff --git a/README.md b/README.md index 4ee7a001d3..8e94cfdaf7 100644 --- a/README.md +++ b/README.md @@ -125,9 +125,15 @@ Project Structure | **controllers**/user.js | Controller for user account management page. | | **models**/User.js | Mongoose schema and model for User. | | **public/*** | Static assets, i.e. fonts, css, js, img. | -| **views/*** | Jade views for controllers | +| **views/account** | Templates relating to user account. | +| **views/api** | Templates relating to API Examples. | +| **views**/layout.jade | Base template. | +| **views**/home.jade | Home page template. | -> **Note:** Although your main template - **layout.jade** only knows about `/css/styles.css` file, you should be editing **styles.less** stylesheet. Express will automatically generate **styles.css** whenever there are changes in LESS file. This is done via [less-middleware](https://github.com/emberfeather/less.js-middleware) node.js library. + +**Note:** There is no difference how you name or structure your views. You could place all your templates in a top-level `views` directory without having a nested folder structure, if that makes things easier for you. Just don't forget to update `extends ../layout` and corresponding `res.render()` method in controllers. For smaller apps, I find having a flat folder structure to be easier to work with. + +**Note 2:** Although your main template - **layout.jade** only knows about `/css/styles.css` file, you should be editing **styles.less** stylesheet. Express will automatically generate **styles.css** whenever there are changes in LESS file. This is done via [less-middleware](https://github.com/emberfeather/less.js-middleware) node.js library. Useful Tools ------------ @@ -169,6 +175,7 @@ TODO ---- - Pages that require login, should automatically redirect to last attempted URL on successful sign-in. - Add more API examples. +- Mocha tests. Contributing ------------ From 1824c0a05e68a547918b0b7ed3766723619410a3 Mon Sep 17 00:00:00 2001 From: Sahat Yalkabov Date: Mon, 27 Jan 2014 07:37:24 -0500 Subject: [PATCH 3/4] Update README.md --- README.md | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/README.md b/README.md index 8e94cfdaf7..6f3f8c6184 100644 --- a/README.md +++ b/README.md @@ -1,5 +1,5 @@ ![Alt](https://lh4.googleusercontent.com/-PVw-ZUM9vV8/UuWeH51os0I/AAAAAAAAD6M/0Ikg7viJftQ/w1286-h566-no/hackathon-starter-logo.jpg) -Hackathon Starter +Hackathon Starter [![Dependency Status](https://david-dm.org/sahat/hackathon-starter.png?theme=shields.io)](https://david-dm.org/sahat/hackathon-starter) ================= A kickstarter for **Node.js** web applications. @@ -31,7 +31,7 @@ Features -------- - **Local Authentication** using Email and Password - **OAuth 2.0 Authentication** via Twitter, Facebook, Google or GitHub -- Error and Success flash notifications +- Sweet Error and Success flash notifications with animations by *animate.css* - MVC Project Structure - LESS stylesheets (auto-compiled via Express middleware) - Bootstrap 3 + Flat UI + iOS7 Theme @@ -39,7 +39,7 @@ Features - **Account Management** - Profile Details - Change Password - - Link OAuth 2.0 strategies + - Link multipleOAuth 2.0 strategies to one account - Delete Account - **API Examples**: Facebook, Foursquare, Last.fm, Tumblr, Twitter, and more. From 8fd6bf38b69adc8e5ece58e86320ed6fea51243f Mon Sep 17 00:00:00 2001 From: Sahat Yalkabov Date: Mon, 27 Jan 2014 07:46:48 -0500 Subject: [PATCH 4/4] Specified npm versions instead of latest (*) --- package.json | 51 +++++++++++++++++++++++++-------------------------- 1 file changed, 25 insertions(+), 26 deletions(-) diff --git a/package.json b/package.json index b8537c70ed..13a2e656b2 100755 --- a/package.json +++ b/package.json @@ -2,31 +2,30 @@ "name": "hackathon-starter", "version": "0.0.0", "dependencies": { - "async": "*", - "bcrypt": "*", - "cheerio": "*", - "connect-flash": "*", - "express": "*", - "express-validator": "*", - "less-middleware": "*", - "request": "*", - "jade": "*", - "mongoose": "*", - "underscore": "*", - "passport": "*", - "passport-oauth": "*", - "passport-local": "*", - "passport-github": "*", - "passport-facebook": "*", - "passport-twitter": "*", - "passport-google-oauth": "*", - - "lastfm": "*", - "github-api": "*", - "sendgrid": "*", - "tumblr.js": "*", - "twit": "*", - "fbgraph": "*", - "node-foursquare": "*" + "async": "~0.2.10", + "bcrypt": "~0.7.7", + "cheerio": "~0.13.1", + "connect-flash": "~0.1.1", + "express": "~3.4.8", + "express-validator": "~1.0.1", + "fbgraph": "~0.2.8", + "github-api": "~0.7.0", + "jade": "~1.1.5", + "lastfm": "~0.9.0", + "less-middleware": "~0.1.15", + "mongoose": "~3.8.5", + "node-foursquare": "~0.2.0", + "passport": "~0.2.0", + "passport-facebook": "~1.0.2", + "passport-github": "~0.1.5", + "passport-google-oauth": "~0.1.5", + "passport-local": "~0.1.6", + "passport-oauth": "~1.0.0", + "passport-twitter": "~1.0.2", + "request": "~2.33.0", + "sendgrid": "~0.4.6", + "tumblr.js": "~0.0.4", + "twit": "~1.1.12", + "underscore": "~1.5.2" } }