In this video we’ll add a search input and new customer button to our List Customers Page. We’ll also use AngularJS Filters to connect our search input to our list of customers, to let us filter through our list of customers.
We look at:
– Continuing to set up the List Customers Page
– Determining the grid layout for mobile vs. larger devices
– Using col-xs and col-sm to change grid sizes based on device size
– Finding and using Bootstrap classes for input-groups for our search bar
– Adjusting the size of input-groups and buttons to align to the wireframe
– Connecting the search input to the list of customers
– Finding Angular Filter documentation on the AngularJS website
– Using Angular Filter syntax to add filtering functionality to our app
– Adding place-holder text to our Search input
Here are 3 quick tips that will help you create beautiful Material Design Wire-frames, with templates, icons, and colour combinations.
I’ve been using the MEAN stack for quite some time now (MEAN is a web app stack which consists of MongoDB, Express, Angular, Node). In the last few months, the stack, predominately the ‘A’ (Angular.js) part of the stack has gone through a process of transition. This has been a bit of an awkward time […]
In this video we’ll look at: Nodejitsu is shutting down! We’ll deploy a mean stack app to Azure. We’ll look at how to create an Azure Web App, deploying to Azure using continuous source control, and fixing .NET errors following deployment.
The Girl Geek Academy is here! I’ve even signed up to teach! It’s such a great concept – The first female-founded global learning academy for girl geek hackers, hustlers, and hipsters.
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
We look at:
– The MEAN Stack Sign-in page
– Creating CSS styles
– Passport.js error messages
– Introduction to Bootstrap Alerts
– Exploring the Angular.js code on the Sign-in page
– Homework – Can you format the Sign-up page? Let me know how you go!
In this video we’ll look at how you can quickly and easily create professional looking wireframes using Adobe Illustrator, and free bootstrap vector graphic templates and vector icons.
In this video we continue styling the Create Customer Page and look at some Angular functionality. We also create our first Customer Record.
We look at:
– Using CSS to style the Create Customer Page
– Create a new Customers CSS File
– Increase the size of the User Glyphicon
– Align the Referred Checkbox to the left using CSS
– Use ng-class to dynamically change the colour of the User Glyphicon based on the Referred checkbox
– Check if we can create a Customer Record without logging in
– Log into the App so that we can use the Customers Menu
– Create our first Customer record
– Look at how $location can be used to route a user to a new view
I’ve been playing around with Angular Material a lot lately, and I’ve been really impressed with how easy it is to create pretty web apps, (once you get the hang of it).
There are so many cool things that I’d like to share, but I don’t know where to begin! So in this video, I’ll take you through my latest side project, and show you the types of things that are possible.
We’re ready to move onto the Login Page! In this video we’ll look at the MEAN Stack App Login Page, and look at how to set up a MEAN App with Passport.js Facebook authentication.
In this video we’ll take a look at the Mongoose package, and set up our customers model that we’ll use to create our customers MongoDB collection.
We look at:
– The Customers Pages, with a focus on the create customer storyboard
– The Mongoose website
– The Mongoose documents relating to ‘Defining your schema’
– Setting up our Customers model, based on our storyboard