Shristi Sharma
  • Latest
  • Store
  • Mean Stack
  • 30 Day MEAN Stack Challenge
  • Web Apps
  • Tech
  • Say Hello
Home \ Author bossable (Page 2)

bossable

Date Title Views Comments
  • Date
  • Title
  • Views
  • Comments

MEAN.js Transition to 0.4 – Part 2

553 0

In this video, we’ll take the app that we prepared as part of the 30 day mean stack app challenge, and move the customer module files across into the new 0.4 app structure.

MEAN.js Transition to 0.4 – Part 1

785 0

In this video, we’ll take the app that we prepared as part of the 30 day MEAN Stack Challenge, and move the files across into the new MEAN.js 0.4 app structure.

Create a vertical MEAN.js 0.4 crud module

1778 13

In this video we’ll create a vertical module for MEAN.js 0.4 using the yeoman meanjs generator!

Install MEAN.js 0.4.0 and run using Gulp

2698 31

It’s time to take MEAN.js version 0.4.0 for a spin! We’ll go through the installation process using the new generator, and run the new app using gulp.

Get AngularJS Batarang Working in Chrome

809 4

Quick steps to show you how to remove your existing version of AngularJS Batarang, and how to install a ‘working’ version.
So you can see your Angular Scopes and Models again!

Set up a free MongoDB database using Compose.io

1220 2

Wondering how to set up a free MongoDB database online? This video goes through the quick steps to show you how to set up a Free MongoDB sandbox database using www.compose.io.

You’ll have your database ready in a couple of minutes!

MEAN Stack – Side by Side with Version 0.4.0

1117 8

In this video we’ll compare the current version of MEAN.js and the upcoming version of the MEAN Stack to get an overview of the new folder structure as part of a sneak peak into version 0.4.0!

Add an AngularJS module to your MEAN Stack App

1273 4

I’ve been getting a few questions on how to go about adding external/custom modules to a MEAN Stack app. If the module is vanilla JavaScript, it’ll need some additional work to create one or more directives, but assuming you have an Angular module, such as one from this site: http://ngmodules.org/, then the process is fairly […]

MEAN Stack: Create an AngularJS Controller with Yeoman

426 0

In this video we’ll use the yeoman generator to create new Angular.js Controller and test files.

MEAN Stack: Create an AngularJS Directive with Yeoman

400 0

In this video we’ll use the yeoman generator to create a new Angular.js directive.

MEAN Stack: Create an AngularJS Service with Yeoman

381 0

In this video we’ll use the yeoman generator to create a new Angular.js factory service.

MEAN Stack – Deploy to Digital Ocean

959 3

In this video we’ll deploy our app to DigitalOcean.
For a free $10 Credit – use my referral ID: 3077d5b2118a www.digitalocean.com/?refcode=3077d5b2118a

We look at:
– The quick steps to create a new Digital Ocean account
– Downloading PuTTY if you’re using a Windows machine
– Creating SSH keys using PuTTYgen
– Adding SSH keys to Digital Ocean
– Creating a new Node.js Droplet
– Using PuTTY to connect to our new Droplet
– Checking the Node.js version of our Droplet
– Push our app up quickly to Bitbucket or GitHub
– Copy the SSH/HTTPS link for our Bitbucket project
– Install Git on our Droplet
– Create a copy of the app on our Droplet using Git and Bitbucket
– CD into the folder for the new app
– Npm install
– Bower install
– Grunt install
– Run our app using Grunt
– Connecting and opening up our app

MEAN Stack – Deploy to Nodejitsu

483 0

In this video we’ll deploy our app to Nodejitsu. Installing the npm package ‘jitsu’, Using the jitsu package, Updating our package.json file for Nodejitsu

MEAN Stack – Deploy to Heroku – Day 30(i)

2255 18

In this video we’ll deploy our app to Heroku

We look at:
– Downloading the Heroku toolbelt from https://toolbelt.heroku.com/
– Signing up to Heroku from https://www.heroku.com/
– Deploying to Heroku

MEAN Stack – Prepare the Build Package for Deployment – Day 30

1576 6

In this video we’ll prepare our mean.js app and get it ready to deploy!!

We look at:
– Using the Grunt Build command to create our application files
– Setting up a new MongoDB for production
– Hooking our new MongoDB instance in our production file
– Commit our file changes using Git

Woohoo now we’re ready to deploy!

MEAN Stack – Express.js & Client-side Assets – Day 29

1157 0

In this video we’ll look at express.js, and how it hooks together the back-end of our MEAN app. We’ll also look at setting up client side CSS and JS assets for our app, both core and minified versions.

We look at:
– Expressjs.com documents and key pages to start with
– The different packages that make up the express portion of the MEAN Stack
– The Server.js file, and how it is used to connect off to a number of other files that run our app
– The Express.js file, and how different elements of the app files are loaded and used by Express.
– The environment files that are used to load CSS and JS assets for our app
– Loading core and minified files as assets for our app
– Loading assets and connecting to MongoDB in a production environment

MEAN Stack – Answering Q’s with CSS & AngularJS directives – Day 28

1012 3

In this video we’ll clean up our app and answer some questions sent through via email and posted on the Bossable.com site. We’ll fix some errors, pretty up our customers list, add a picklist using ng-options, and fix the alignment between channel and email.

We look at:
– Fixing some of the task errors identified by Grunt
– Using Chrome to test out adding some padding between the customer records in the customers list
– Adding a new class with padding to our customers css file
– Using ng-class to add some colours to the customers list based on the referred field.
– Increase the size of the icon on the customers list
– Adding drop down values to our app using ng-options
– The AngularJS documentation and examples for ng-options
– Adding ng-options to our controller and edit customers client view
– Testing our new picklist in the Update Customer Modal
– Fixing the alignment of fields between the Channel and Email fields.

MEAN Stack – AngularJS Notification Service – Day 27

1361 4

In this video we’ll create our own notification service using an AngularJS Factory with publication and subscription methods. We’ll use this service to send messages between our Create Customer Modal, and our Customer List to refresh the list when a new customer is created.

We look at:
– Creating a new AngularJS notification Factory Service
– Setting up functionality within the Service to send a message and data
– Setting up functionality with the Service to receive a message and data
– Hooking up our Create Customer Controller with the new notification service
– Using the new notification service to send data when a new customer is created
– Hooking up our Customer List directive with the new notification service to update the list when a new customer is created
– Creating a new customer to test out our new Service

MEAN Stack – Style our AngularJS Create Modal & Delete Customers – Day 26

1164 2

In this video we’ll style our AngularJS Create Customer Modal, and create our first customer using our new Modal. We’ll then add functionality to delete Customers from our list.

We look at:
– A quick recap of opening up our new Create Customer Modal
– Changing the ng-class reference for the Referred field (from danger to pink)
– Making the Surname field a required field
– Creating a reference from our model fields back to our controller
– Creating a new customer using our Create Customer Modal
– Checking our console logs to tell if our record was saved
– Refreshing the page to show our new customer record
– The functions that are still missing from our Controllers
– Adding ‘Delete’ functionality to our controller
– Adding a new button with ng-click to call the delete functionality
– Deleting a customer record from our list of customers

MEAN Stack – Create Customer AngularJS Modal – Day 25

1367 14

In this video we’ll start to set-up our AngularJS Create Customer Modal. We’ll begin by turning our create customer view into a Modal window, and get it to popup using the ‘New Customer’ button.

We look at:
– The current create customer view
– Changing the top and bottom of the create customer view to align it with the update customer modal
– Changing our references to refer to the customer create controller
– Changing the controller alias references on the new Create Modal buttons
– Setting up the Create Customer Controller by reusing the existing create function and changing it up
– Using the code for the update customer modal directive as a template to create a new create customer modal directive.
– Adding a reference to our new Modal from the Customer List ‘Create Customer’ button
– Opening up our new Create Customer Modal

Bossable - From idea to boss, with fun and friendly tutorials and videos
  • © Bossable 2015
  • Tech
  • Mean Stack
  • Contact Us
  • Privacy
  • Terms
  • Close
  • Latest
  • Store
  • Mean Stack
  • 30 Day MEAN Stack Challenge
  • Web Apps
  • Tech
  • Say Hello