/25-angular_auth

Lab 25 - Angular Auth

Primary LanguageJavaScript

cf Lab 25 - Client Side Auth

To Submit this Assignment

  • create a fork of this repository
  • push to your repository
  • submit a pull request to this repository
  • submit a link to your PR in canvas
  • write a question and observation on canvas

Include

  • .eslintrc
  • .babelrc
  • .gitignore
  • package.json
    • create an npm build script for running webpack
    • create an npm build-watch script for running webpack-dev-server --inline --hot
    • create an npm test script for running karma and all associated tests
    • create an npm test-watch script for running karma on file system changes
    • create an npm lint script for linting your JS with eslint
  • ignore the build directory
  • webpack.config.js
    • this should include all of the production environment configurations used in lecture code
  • karma.config.js

Description

  • Create these directories to organize your code:
    • app
    • app/config
    • app/view
    • app/view/home
    • app/view/landing
    • app/scss
    • app/scss/lib
    • app/scss/lib/base
    • app/scss/lib/layout
    • app/scss/lib/theme
    • app/service
    • app/component
    • app/component/landing
  • include a main.scss
  • include an .scss partial for each component you create
  • style the application to meet the sign in & sign up mockups provided in the wireframes directory of this repo
  • use require.context to add all of your angular construct definitions

Clone

  • Clone, setup, and run the slugram-backend application in order for your angular app to communicate with the server
  • slugram-backend
    • note - to access the deployed backend use the following:
      • https://slugram-backend.herokuapp.com
    • note - if you are using the cloned version, be sure to add your .env file - you can use the same one we used for our lecture 18 deployment
    • note - this application should be running on the staging branch
    • note - DO NOT include this application with your assignment submission

Functional Requirements

  • Create 2 views: /#/, /#/home/
    • each view should have its own controller
    • the /#/ view should be the default landing page
    • the landing page markup should contain <signup> and <login> components
  • Create an auth service with for making http requests to the slugram-backend application
    • this should have contain methods for sign up and sign in routes
    • this should have methods to get and delete a token from local storage
  • Create a sign up component
    • this should have its own controller and use the controllerAs syntax
    • this should have a form with username, email, and password fields
    • this should use the auth service to signup and store a token
    • this should redirect the page to /#/home on a successful form submit
  • Create a login component
    • this should have its own controller and use the controllerAs syntax
    • this should have a form with username and password fields
    • this should use the auth service to login and store a token
    • this should redirect the page to /#/home on success