Giter VIP home page Giter VIP logo

hpl-tutorials's Introduction

HPL Tutorials

Instructions for Download

  1. In terminal, go to your work directory (using cd) and type git clone [email protected]:ijlee2/hpl-tutorials.git.
  2. Type cd hpl-tutorials.
  3. Each folder inside hpl-tutorials is an Ember app that you can install and run locally. For example, to run the first tutorial, you can type cd hpl-tutorial-01, then ember s.
  4. Once an app is running, visit localhost:4200 on Chrome or Firefox.

Summary

#01 (Dec. 9th, 2018)

  • Use ember new to create an Ember project
  • Use ember serve (or ember s) to start the Ember app
  • Understand Component-Driven Design (templates, components)
  • Investigate why the default welcome page is rendered (see app/templates/application.hbs)
  • Use ember generate component (or ember g component) to create 2 components, my-list and my-list-item
  • Display the name of 1 person using my-list and my-list-item components
  • Display the names of 3 people using {{each}} helper
  • Update the stylesheet (app/styles/app.css)

To learn more, visit:

#02 (Dec. 11th, 2018)

  • Use ember g route to create members and officers routes
  • Use {{link-to}} helper to navigate between routes
  • Understand the purpose of {{outlet}}
  • Use a route's model() to display data
  • Use ember install to install addons (e.g. ember-cli-sass)

To learn more, visit:

#03 (Dec. 20th, 2018)

  • Use a controller to filter data from a route's model()
  • Define a model's attributes
  • Understand the purpose of an adapter and a serializer
  • Use Mirage and Faker.js to create mock data
  • Use ember-test-selectors to write integration and acceptance tests

To learn more, visit:

hpl-tutorials's People

Contributors

ijlee2 avatar

Watchers

 avatar  avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.