O'Reilly logo

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Hands-On Full Stack Web Development with Aurelia

Book Description

Develop rich and scalable web applications with Node.js, Express.js, and MongoDB

About This Book
  • Learn the advanced features of Aurelia to build responsive web applications
  • Write clean, modular, and testable code that will be easy to maintain and evolve
  • Harness the power of JavaScript on the client and server side to build full-stack applications
Who This Book Is For

Hands-On Full Stack Web Development with Aurelia is for you if you are a web or full-stack JavaScript developer who has experience with traditional stacks such as LAMP, MEAN, or MERN and wish to explore the power of Aurelia and new stack with modern web technologies.

What You Will Learn
  • Employ best practices and modern approaches to create frontend applications
  • Learn about modern CSS preprocessors and improve the readability of your application
  • Use the Aurelia framework to create navigable web applications
  • Write your own tests, making your application secure and fault-tolerant
  • Create solid RESTful APIs using the microservice architecture
  • Understand the NoSQL paradigm and get the best performance from your database
  • Integrate third-party libraries such as Gmail for Single Sign On
  • Write UI testing scripts and integration tests to build extensible apps
In Detail

Hands-On Full Stack Web Development with Aurelia begins with a review of basic JavaScript concepts and the structure of an Aurelia application generated with the Aurelia-CLI tool. You will learn how to create interesting and intuitive application using the Aurelia-Materialize plugin, which implements the material design approach. Once you fully configure a FIFA World Cup 2018 app, you'll start creating the initial components through TDD practices and then develop backend services to process and store all the user data.

This book lets you explore the NoSQL model and implement it using one of the most popular NoSQL databases, MongoDB, with some exciting libraries to make the experience effortless. You'll also be able to add some advanced behavior to your components, from managing the lifecycle properly to using dynamic binding, field validations, and the custom service layer.

You will integrate your application with Google OAuth Service and learn best practices to secure your applications. Furthermore, you'll write UI Testing scripts to create high-quality Aurelia Apps and explore the most used tools to run end-to-end tests. In the concluding chapters, you'll be able to deploy your application to the Cloud and Docker containers.

By the end of this book, you will have learned how to create rich applications using best practices and modern approaches.

Style and approach

This is a comprehensive example-based book that guides you to create highly scalable applications using the new MEAN Stack.

Downloading the example code for this book You can download the example code files for all Packt books you have purchased from your account at http://www.PacktPub.com. If you purchased this book elsewhere, you can visit http://www.PacktPub.com/support and register to have the files e-mailed directly to you.

Table of Contents

  1. Title Page
  2. Copyright and Credits
    1. Hands-On Full Stack Web Development with Aurelia
  3. Dedication
  4. Packt Upsell
    1. Why subscribe?
    2. PacktPub.com
  5. Foreword
  6. Contributors
    1. About the authors
    2. About the reviewer
    3. Packt is searching for authors like you
  7. Preface
    1. Who this book is for
    2. What this book covers
    3. To get the most out of this book
      1. Download the example code files
      2. Conventions used
    4. Get in touch
      1. Reviews
  8. Introducing Aurelia
    1. JavaScript fundamentals
      1. Dynamic typing
      2. Object oriented
      3. Functional
      4. Prototyped
      5. Events handling
    2. The ECMAScript standard
      1. ES 6
        1. Arrow functions
        2. String interpolation
        3. Destructuring
    3. Setting up our environment
      1. Installing Node.js
      2. The Node Package Manager
        1. NPM website
        2. NPM Registry
        3. NPM CLI
      3. Common NPM operations
        1. Updating NPM
        2. Installing NPM packages
          1. Versions
        3. The package.json file
          1. Dependencies and devDependencies
    4. The Aurelia framework
      1. What is a JavaScript framework?
      2. Why use a JavaScript framework?
      3. JavaScript framework comparison
      4. Why Aurelia?
        1. Angular
          1. Technical information
          2. Dependency injection
          3. Component encapsulation
        2. React.js
          1. Technical information
          2. Dependency injection
          3. Component encapsulation
        3. Aurelia
          1. Technical information
          2. Dependency injection
          3. Component encapsulation
    5. Aurelia command-line tool
      1. Installation
      2. Creating a new application
      3. Running our Application
      4. Testing our application
      5. Building our application
      6. Generating custom resources
    6. World Cup app overview
      1. Exploring the application features
        1. Matches explorer
          1. Listing the matches
          2. Creating a new Match
        2. Teams explorer
          1. Listing the teams
          2. Creating a new team
        3. News
          1. Listing the News
          2. Create a New
        4. Social authentication
      2. Creating our app
      3. The project structure
      4. The Bootstrap process
      5. Understanding components
    7. Summary
  9. Styling the User Interface
    1. Talking about CSS
      1. How does it work?
    2. Exploring SASS and LESS
      1. Variables
      2. Nesting
      3. Extends
      4. If/else statements
    3. Automating tasks with Gulp
      1. Understanding Gulp
        1. How does Gulp.js work?
        2. Installing Gulp
      2. JavaScript task
      3. Automating tasks
    4. Exploring CSS frameworks
      1. Bootstrap
      2. Material Design
        1. Material is the metaphor
        2. Bold, graphic, and intentional
        3. Motion provides meaning
      3. Semantic UI
      4. The mobile-first approach
    5. Configuring our project with Aurelia-Materialize
    6. Summary
  10. Testing and Debugging
    1. Benefits of testing
      1. For the development team
      2. For the project
      3. For the organization
      4. For the users
    2. Test-Driven Development
      1. Making our code fail
      2. Implementing the code
      3. Refactoring our code
    3. Aurelia testing frameworks
      1. Learning JasmineJS
        1. Installation and configuration
        2. Test suites
        3. Test cases
        4. Expects
      2. Learning KarmaJS
        1. Installing karma
        2. Configuring Karma
        3. Testing example
        4. Launching the test runner
    4. Testing an Aurelia component
      1. Coding the application
        1. Creating the application
        2. Creating our component
          1. Implementing the info-box view model
          2. Implementing the info-box view HTML template
          3. Rendering the info-box component
      2. Writing the test
        1. Bootstrapping the component
        2. Testing the component
    5. Debugging our code
      1. Refactoring our application
      2. Debugging with Chrome Developer Tools
    6. Summary
  11. Creating Components and Templates
    1. Lego components
      1. A little puzzle
    2. Learning how DI works
    3. Managing a component's life cycle
    4. Managing events with Aurelia
    5. Data binding
      1. Binding computed properties
        1. Value converters
    6. Routing and resources
    7. Testing our components
      1. Testing component life cycle
    8. Time to practice!
    9. Summary
  12. Creating Our RESTful API
    1. Understanding RESTful
      1. Understanding HTTP
        1. URLs
        2. Verbs
        3. Headers
        4. Body
      2. CRUD over HTTP
    2. Designing APIs
      1. API first
      2. API design
        1. Nouns as paths
        2. HTTP verbs for CRUD
        3. API documentation
    3. Creating an API with Node.js
      1. Node advantages
        1. Asynchronous
        2. Single-thread
      2. Simple HTTP Server
    4. Improving our API with Express.js
      1. Coding our server
      2. Using routes
    5. Coding our project
      1. Our project structure
      2. Implementing the Teams API
        1. Configuring the JSON Parser
        2. Refactoring routes
        3. Creating a team
        4. Retrieving the list
        5. Updating a Team
        6. Deleting a Team
    6. Summary
  13. Storing Our Data in MongoDB
    1. NoSQL databases
      1. Document databases
    2. Introducing MongoDB
      1. Installing MongoDB
      2. CRUD operations
        1. Creating a document
        2. Retrieving documents
        3. Updating documents
        4. Deleting documents
    3. MongooseJS
      1. Installing Mongoose
      2. Configuring Mongoose
      3. Defining schemas
        1. Data types
        2. Validation
      4. Creating models
    4. Integrating our API with MongoDB
      1. Decoupling the Team Model
      2. Implementing the Rest Controller
        1. Connecting the app
        2. Creating a new team
        3. Listing the teams
        4. Finding a single team
        5. Updating teams
          1. The async/await instruction
        6. Deleting teams
    5. Summary
  14. Advanced Features on Aurelia
    1. Subscribing and publishing events – Event Aggregator at the rescue!
      1. Configuring Event Aggregator
        1. publish(event, data)
        2. subscribe(event, callbackFunction)
        3. subscribeOnce(event, callbackFunction)
    2. Adding more languages to our application – Internationalization!
      1. Installation and configuration
        1. For Webpack users
        2. JSPM users
        3. Aurelia CLI users
      2. Configuring and defining our first translation files
      3. Using the plugin – Multilanguage support!
    3. Tracking method calls and user actions – Logging
      1. Configuring your log manager
    4. Modal configuration – Aurelia dialog at rescue!
      1. Getting the Aurelia-dialog plugin
      2. Adding dialog components to our application
    5. Dynamic value converters – Less code, more functionality
      1. The problem – Data is not exposed as we need
    6. Binding custom behaviors to our application
    7. Improving our application forms – Validators
      1. Preparing for war – Getting the validation plugin
      2. First steps – Defining our rules
    8. Manipulating the DOM – Custom attributes
    9. Understanding how computed properties work
    10. Summary
  15. Security
    1. Understanding JSON Web Tokens
      1. JWT
    2. Custom authentication and authorization
      1. Implementing authentication
        1. The authentication logic
        2. Generating the token
        3. The authentication REST controller
      2. Implementing authorization
      3. Creating the Admin API
      4. Managing matches
        1. Creating the Match schema
        2. Creating the REST controller
          1. Creating Matches
          2. List Matches
          3. Updating the Scores
        3. Securing the REST controller
          1. Validate token
          2. Validate permissions
    3. Introducing Auth0
      1. A simple example
        1. Creating an account
        2. Registering an Auth0 client application
        3. Exploring our example application
    4. Social Login with Auth0
    5. Single sign-on
    6. Summary
  16. Running E2E Tests
    1. Integration testing – Multiple services, one application
      1. Configuring applications for integration testing
      2. Mocking external dependencies
      3. Calculating code coverage
    2. Does our app meet our business requirements? UI testing
      1. Scripted testing
      2. Exploratory testing
      3. UX testing
      4. Planning our tests – Time for the truth
      5. Defining common scenarios
      6. Writing test cases
      7. Organizing our test – Creating scripts
    3. API test with Swagger
      1. Installing Swagger
    4. Summary
  17. Deployment
    1. Configuring our web for production
    2. Deploying on your own server
      1. Creating our NGINX configuration file
      2. Creating our Dockerfile
      3. Running our application on Docker
    3. Deploying on Heroku
      1. Creating a Heroku account
      2. Preparing the application
      3. Deploy
    4. Deploying on AWS S3 Buckets
      1. Uploading files
      2. Configuring our S3 Bucket for the web
    5. Summary
  18. Other Books You May Enjoy
    1. Leave a review - let other readers know what you think