Angular Nx Workspace
Description
A workspace generated with the amazing Angular Nx. This workspace includes many components that solve common Angular problems. I have used Bootstrap so all the components are in a single project.
Here I have the modules:
Component Interactions
Component interaction techniques using the EventEmitter object, @Input, @Output, @ViewChild directives and a shred service with RxJs.
Form Validation
An Angular simple application to show form validation. This is a fork from a schotch.io project. I have thought I could add some styles and Karma unit tests to see how you can test forms with Angular. The result is pretty interesting for frontend beginners and testers.
There are 4 different forms:
- Template Driven Form
- Model Driven (Reactive) Form
- Model Driven (Reactive) Form with Validation
- Login Form that integrates the Auth0 API
To get the Login Form to function properly, you will need to have an Auth0 account, you can sign up for a free Auth0 account here. Once you have an account go into the app.login.ts
file and make the following edits:
- Replace
YOUR-AUTH0-CLIENT-ID
with your credentials - Replace
YOUR-AUTH0-DOMAIN
with your Auth0 domain - Replace
YOUR-DATABASE-CONNECTION
with whatever you name your username and database connection in the Auth0 Management Dashboard
Two Sums
The problem: given an array of numbers with no duplicates and a single target number, find two numbers. The sum of these two numbers must be equals to the target number.
Starting with the first number of the array, the index of the second number must not be less than the current index. You can traverse the array only one time.
Unique IDs in Modal Window
unique IDs select in a modal window. The user is able to select only 1 ID from a list. When an ID is selected, a new row of selection is created dynamically.
This was a great challenge. The project shows how to deal with multiple lists, components, and services.
Tests with Karma, Jasmine, and Protractor are included with a successful Travis configuration for the continuous integration.
SEO Tools
Validate title and description meta tags, extract keywords from a text string and show a long checklist of tasks for web applications and websites.
CRUD REACT app using hooks
This React application performs CRUD operations for a list using the new React hooks.