0% found this document useful (0 votes)
28 views

UI Development Syllabus

This document provides an overview of the topics covered in a UI development with Angular course. It begins with introductions to HTML, CSS, JavaScript, Node.js, and Angular. It then delves into specific Angular concepts like modules, components, data binding, directives, dependency injection, routing, forms, pipes, HTTP requests, authentication, and unit testing. It also covers related technologies like Bootstrap, Express.js, and Node.js modules. The document serves as a syllabus outlining the structure and content of the course.

Uploaded by

swathirekha
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
28 views

UI Development Syllabus

This document provides an overview of the topics covered in a UI development with Angular course. It begins with introductions to HTML, CSS, JavaScript, Node.js, and Angular. It then delves into specific Angular concepts like modules, components, data binding, directives, dependency injection, routing, forms, pipes, HTTP requests, authentication, and unit testing. It also covers related technologies like Bootstrap, Express.js, and Node.js modules. The document serves as a syllabus outlining the structure and content of the course.

Uploaded by

swathirekha
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 16

UI DEVELOPMENT WITH ANGULAR

HTML

Basic
o HTML Introduction
o Document structure
o Elements and Attributes
o Block and Inline Elements
o Hyperlinks, Images, Paragraphs
o Structuring pages
o Page Layouts
o Difference between table and divs
o Form Elements
o Frames

Advanced
o HTML5 Introduction
o Semantic Elements
o Media Elements
o Meta Elements and attributes
o Canvas and SVG
o Forms and Attributes
o Web Storage

CSS

Basic
o CSS Introduction
o Syntax
o Selectors
o Background Properties
o Text and Font Properties
o Box Model
o Display and Positions
o Floats
o Layout designs step by step
o Combinators Psuedo classes and Elements

Advanced
o CSS3 Introduction
o Borders and Box Effects
o New Background properties
o Transformations 2D & 3D
o Transitions
o Animations
o Flexbox
o Multi column Layout/Grids
o Media Queries

Bootstrap 5 (RWD)

o Bootstrap 5 Introduction
o Layouts
o Contents
o Forms
o Components
o Helpers
o Typography & Utilities
o Grid System & Flexbox
o Javascript Widgets
o Boiler Plate Templates
Javascript

o Javascript Introduction
o How it works
o Javascript console
o Fundamentals – 1
 Primitive Data
 Variables
 Operators
 Functions
 Loops
 Conditions
 Objects
 Arrays
 ES5 & ES6
o Fundamentals – 2
 Arrow Functions
 Array methods
 Object methods
 Looping Arrays
o Code Debugging
o DOM and Events Fundamentals
o Event Handellers
o Javascript Behind the Scenes
o Numbers, Dates
o Data structures
o Working with Arrays
o OOP with Javascript
o Geo Location, External Libraries
o Modules, Tooling and Functional
o Ajax
o JSON
o Fetch api
o Async/Await
o Error handling
o Best Practices
o Code Challenges

ANGULAR SYLLABUS
1. Angular
o What is Angular
o Difference between Angular Versions
o Angular CLI and Troubleshooting
o Node JavaScript Introduction
o Setup a Project
o Setup Nodejs with Angular
o Typescript Introduction
o What is bootstrap
o Create Your Fist App

2. Modules and Components


o What is Component in Angular
o What is Module in Angular
o Create and Start Component
o Why Components are important.
o How we create a component
o Create Component using CLI
o What is nesting Component
o What is Component Template
o Component Styles and Selectors

3. Data Binding in Angular


o What is Data binding
o Splitting Application into Component
o String Interpolation
o What is Property Binding
o Difference between Property Binding and String Interpolation
o Binding with Custom Events.
o What are Binding Properties and Events
o Two Way binding
o Combine Forms with Data binding
o Custom Properties
o What is Encapsulation
o How to Use Local Reference in Templates
o Template Access and DOM
o Component Lifecycle
o What are Hooks in Angular
o Access Template with Hooks

4. Directives in Angular
o What are Directives
o Using Output Data Conditionally
o What is ng if and else condition
o Output List
o Styling Element with ngStyle
o How to apply css class dynamically with angular js
o How to Create Basic Attribute Directive
o What is Renderer
o What is HostBinding and HostListener
o Directive Properties
o ngSwitch

5. Dependency Injection in Angular


o What is Dependency Injection
o What is Services
o Logging Service and Injection
o Create Data Service
o Instance of Services
o Insert Service into Services
o How to use service in Cross Component
o What is Hierarchical Injector

6. Routing
o What is Routing?
o Loading of Routes
o Navigation and it path
o Styling of Router Links
o Relative Path Navigation
o De ne parameter in Routing
o Fetch Routing Parameter
o Observables
o Passing & Retrieving Parameters & Fragments
o Nested RoutingCon g Query Parameters
o Redirection Routes
o Route con guration
o Route Guards
o Protect Routes with canActivate
o Navigation Controlling
o Static Data in Route
o Location Strategies

7. Forms
o What is Forms and how do we handle it?
o Reactive Approach
o Template Driven
o Create Template Driven Forms
o What is Registering Control
o Use and Submit of Forms
o Access of Forms
o How to add validation in use input
o Build-In Validation
o HTML5 Validation
o Output Validation and Error Messages
o Two Way Binding
o Grouping
o Radio Button Handling
o Patch Forms Values
o Resetting Templates form Forms
8. Reactive Forms
o What is Reactive Forms
o Create Reactive form through code
o Syncing of HTML and Form
o Adding Validation
o Sumit Forms
o Grouping
o Form Control Arrays
o Custom Validators
o Relative Forms
o Async validation
o Value changes and Reacting to status

9. Pipes
o What is Pipes in Angular
o How we use pipes
o Chaining Multiple pipes in angular
o parameterizing a pipe
o Filter Pipe
o Impure & Pure Pipe
o async Pipes

10. HTTP Requests


o What is HTTP Requests
o How it work
o How to send requests
o Adjusting Request Headers
o How to handle Get and Put Request
o Catching HTTP Error
o Async with HTTP Requests

11. Authentication
o What is Authentication
o How Authentication Work
o Introduction to JSON Web Tokens
o Creating Page and Route
o Firebase SDK
o User Signing UP and In
o Sending Token & Requiring
o Authentication Status
o How to add Logout button
o Protection & Redirection of Route

12. Angular Modules


o What is idea behind Modules
o What is feature Modules and how we create it
o What is App Modules
o Registering Routes in Feature Modules
o What is Shared Module and how we create
o Create the Auth Feature module
o What is Lazy LoadingHow to Modules & Services works
o What is Core Module
o How to Create Basic Core Module
o AOT Compilation with CLI

13. HTTP Client


o What is HttpClient and how we unlock it
o Request Configuration with Response
o Request Events
o Set up Headers
o HTTP Parameters
o Progress
o What is Interceptors
o Modify Request in Interceptors
o Multiple Interceptors

14. Animations
o What is Angular Animations
o Triggers and State
o Switch between States
o Basic and Advanced Transitions
o What is void state
o Key frames in animation
o Grouping
o Animation Callback

15. Unit Testing


o What is Unit Testing
o How to Analyze CLI Testing Setup
o Running Test with CLI
o Components and dependencies
o Async Tasks
o Adding Component with tests
o Difference between Isolated and Non-isolated Tests
NodeJs

Introduction to Node.js:
o What is Node.js?
o Node.js Architecture and Event Loop
o Installation and Setup
o Hello World in Node.js
o Advantages and Use Cases

Understanding Asynchronous Programming:


o Synchronous vs. Asynchronous Programming
o Callbacks and Callback Hell
o Promises and Async/Await
o Handling Errors in Asynchronous Code

Node.js Modules and NPM:


o Introduction to CommonJS Modules
o Creating and Exporting Modules
o Using NPM (Node Package Manager)
o Managing Dependencies with package.json
o Publishing and Installing Packages

Creating and Managing Servers with Node.js:


o Building a Basic HTTP Server
o Handling HTTP Requests and Responses
o Routing and Middleware
o Serving Static Files
o Implementing HTTPS

Building RESTful APIs with Node.js:


o Introduction to RESTful APIs
o HTTP Verbs and Endpoints
o Request and Response Formatting (JSON)
o CRUD Operations with RESTful APIs
o RESTful API Best Practices
Working with Express.js Framework:
o Introduction to Express.js
o Setting Up an Express Application
o Routing in Express
o Middleware in Express
o Error Handling in Express

Introduction to Express.js

o What is Express.js?
o Why use Express.js for web development?
o Setting up a basic Express.js application
o Handling HTTP Requests and Responses

HTTP Methods (GET, POST, PUT, DELETE, etc.)


o Route handling with Express.js
o Sending responses and status codes
o Creating custom error handling middleware
o Routing and Middleware

Implementing Express.js middleware


o Creating and organizing routes
o Route parameters and query strings
o Handling form data and request body

Introduction to templating engines


o Integrating templates with Express.js
o Passing data to templates
o Rendering dynamic views with templates

Express.js Middleware

o Built-in middleware in Express.js


o Creating custom middleware
o Handling authentication and sessions
o Express.js security middleware (e.g., Helmet)

Authentication and Authorization in Node.js:

o Understanding Authentication and Authorization


o Implementing User Registration and Login
o Using JWT (JSON Web Tokens) for Authentication
o Role-Based Access Control (RBAC)
o Securing Routes and Resources

Postman for API Testing


o Introduction to Postman
o Sending HTTP requests with Postman
o Writing test scripts and assertions

Error Handling and Logging


o Handling errors in Express.js
o Error logging and reporting
o Handling uncaught exceptions and rejections
o Using logging library Winston
o Common Types of Errors in Node.js
o Using Try-Catch Blocks
o Debugging with Node.js Debugger
o Logging and Error Handling Middleware
o Tools for Debugging Node.js Applications

Middleware for Caching and Performance Optimization


o Caching responses with Redis
o Gzip compression for faster responses
o Optimizing Express.js performance
o Handling CORS (Cross-Origin Resource Sharing)

Real-Time Web Applications with Socket.IO


o Introduction to WebSockets and Socket.IO
o Implementing real-time features in Express.js
o Broadcasting messages and handling events
o Building a real-time chat application

Mongo Db
Introduction to MongoDB and Mongoose

o What is MongoDB?
o Why use MongoDB for database storage?
o Introduction to Mongoose and its features
o Setting up MongoDB and Mongoose

Installing MongoDB on your system


o Connecting Node.js application to MongoDB using Mongoose
o Creating a MongoDB database and collections
o Creating MongoDB Schemas

Defining Schemas with Mongoose


o Specifying data types and validation rules
o Adding default values and setting up required fields
o CRUD Operations with Mongoose
o Creating and inserting documents into MongoDB
o Reading and querying data with Mongoose
o Updating existing documents in MongoDB
o Deleting documents from MongoDB
Data Modeling and Relationships
o Embedding documents in Mongoose schemas
o Creating references between documents
o Implementing one-to-one, one-to-many, and many-to-many relationships
o Advanced Queries with Mongoose
Advanced Queries with Mongoose

o Using comparison operators (e.g., $gt, $lt, $in)


o Sorting and pagination of query results
o Aggregation framework for complex queries

GIT

1. Introduction to Version Control


- What is version control?
- Benefits of version control
- Git as a distributed version control system

2. Installing Git
- Downloading and installing Git on different platforms (Windows, macOS, Linux)
- Configuring Git with your name and email

3. Git Basics
- Initializing a new Git repository
- Cloning an existing repository
- Understanding the working directory, staging area, and repository

4. Basic Git Commands


- git add: Adding changes to the staging area
- git commit: Committing changes to the repository
- git status: Checking the status of the repository
- git log: Viewing commit history
- git diff: Viewing changes between files and commits

5. Branching and Merging


- Creating and switching branches
- Merging branches
- Resolving merge conflicts

6. Remote Repositories
- Connecting a local repository to a remote repository (GitHub, GitLab, Bitbucket)
- Pushing changes to a remote repository
- Pulling changes from a remote repository

7. Collaboration with Git


- Forking a repository
- Creating pull requests
- Reviewing and merging pull requests

8. Git Workflow
- Understanding feature branches and release branches
- Git flow model
- Best practices for collaborative development with Git

9. Undoing Changes
- git reset: Unstaging changes
- git checkout: Discarding changes in the working directory
- git revert: Reverting commits

10. Git Ignore


- Creating a .gitignore file
- Ignoring files and directories in the repository

Office Etiquettes

Meeting etiquettes
Email etiquettes
And other basic communication etiquettes that one should follow in office

Agile
Introduction to Agile
Agile roles and responsibilities: Scrum Master, Product Owner, and Development Team.
What is Scrum
What are all sprint ceremonies
Cloud computing Basics
What is cloud computing
Introducing basic services of AWS such as EC2, Lamda, S3..etc.

You might also like