Details
The front-end is what the user sees and interacts with. It’s the app on your phone or the website you visit. So, front-end developers are in charge of building beautiful, interactive user interfaces.
- As a front-end developer, you should know HTML, CSS, JavaScript and at least one of the popular JavaScript frameworks/libraries that are used for building client apps, including Angular, React and Vue.
Outline
Diploma Courses:
HTML, CSS and JavaScript:
Module 1: How the web works?
Angular 8
Bootstrap:
- HTML, CSS and JavaScript (40 Hours)
- Angular 8 (40 Hours)
- Bootstrap (8 Hours)
HTML, CSS and JavaScript:
Module 1: How the web works?
- Web development environment
- Web design and development workflow
- Web technologies
- HTML History
- HTML Document/Page Types
- Tags, attributes, Doctypes
- HTML Forms and Lists
- Module 3: CSS
- CSS Fundamentals
- CSS properties and Methods
- CSS Floats and Layouts
- CSS Inheritance
- JavaScript Values, variables, operators
- Type Conversions
- Arrays
- Conditional Statements
- Objects
- Loop Statements
- Tags in HTML5
- Form handling and validations
- Data Storage
- Web SQL and indexed database
- HTML5 Input Types
- HTML Form Attributes
- Embedding audio and video
- Geolocation API
- Canvas API
- CSS3 properties
- CSS3 Animations
- CSS3 Layouts
- Rounded and Elliptical Borders
- Box Shades
- Multiple background images
- What is Object Oriented JavaScript?
- DOM Manipulation
- Understanding DOM
- DOM methods and events
- Inner functions, closures
- Anonymous functions
- Immediate functions
- Ajax
- Introduction to jQuery
- Selectors
- Events
- Hide/Show
- Fade/Slide
- Animate
- Call-backs
- Chaining
- CSS Classes
- jQuery css()
- Dimensions
- Traversing
- Ancestors
- Descendants
- Siblings
- Filtering
- Ajax in jQuery
- DOM manipulation using jQuery
- jQuery Filtering
Angular 8
- User Experience similar to a Desktop Application
- Productivity and Tooling
- Performance
- Community
- Full-featured Framework
- Platform for Targeting Native Mobile not just Web Browsers
- What is Typescript
- Why Typescript
- Setup and installation
- IDE support
- Scoping using Let and Const Keywords ( ES6 )
- Template Literals ( ES6 )
- Spread Syntax and Rest Parameters ( ES6 )
- Destructuring ( ES6 )
- Type inference
- Type Annotations
- Number
- Boolean
- String
- Array
- Tuple
- Enum
- Any
- Void
- Null and Undefined
- Never (Typescript 2)
- Using types in functions
- Function as types
- Optional and default parameters
- Arrow functions
- Inheritance
- Access modifiers
- Getters and setters
- Readonly & static
- Optional properties and methods
- Strict structural contract
- Extending interface
- Implementing interface
- Introduction
- Import
- Export
- Default
- Angular CLI
- Anatomy of the project
- Debugging Angular apps
- Working with Augury
- Modules
- Components
- Templates
- Metadata
- Data binding
- Directives
- Services
- Dependency injection
- Why modules
- How to create modules
- Built in modules
- Root Module
- Feature module
- @ Component decorator
- Component configuration object
- Custom components
- Component with templates
- Inline
- External
- Component with Styles
- Inline
- External
- HTML as template
- Data binding
- Interpolation
- Property Binding
- Event Binding
- Two way binding
- Template expressions
- Template syntax
- Attribute, class and style bindings
- @Input()
- @Output
- Template reference variables
- Safe navigation operator
- Built-in directives
- Structural directive
- Attribute directive
- Built-in pipes
- @Pipe decorator
- @angular/forms library
- Template driven forms
- Form and field validation
- Validation check with ng-pristine,ng-dirty, ng-touched, ng-untouched, ng-valid, ng-invalid
- Show and hide validation error messages
- Form submission with ngSubmit
- Reactive/ Model drive forms
- ReactiveFormsModule
- FormGroup, FormControl classes
- FormBuilder for easy form building
- Validations using Validators
- Setting form model using setValue and patchValue
- Use FormArray to build repeated form controls or form groups
- Why DI
- @Injectable decorator
- Custom service development
- Registering the service with NgModule using providers key
- Provider Types
- Class
- Factory
- Value
- @angular/router library
- Configure routes
- forRoot and
- RouterOutlet, RouterLink, RouterLinkActive
- Nested Routes
- Parametrized routes
- Route guards
- Observable interface
- Streams
- Operators
- Subscription
- Subject
- Schedulers
- Setup installing the module
- Making a request for JSON data
- Typechecking the response
- Error handling
- Sending data to the server
- Making a POST request
- Configuring other parts of the request
- Testing in Typescript
- Testing Component
- Testing Service/Provider
- Testing Pipe
- Manually
- Using the Angular CLI with Ahead-Of-Time (AOT) Compilation and Tree-Shaking (removing unused library code)
Bootstrap:
- Introduction
- Bootstrap Library
- Container Class
- Designing in Grids
- Typography
- CSS and HTML
- JavaScript Components
Reviews
Be the first to write a review about this course.
Write a Review
Since 1995, CLS Learning solutions is leading the technology learning market in Egypt, the Middle East, and Africa. With our wide network of international partners, trainers, instructors, and technology leaders; we are able to deliver top notch training programs to our students and technology professionals.
25 Years in the market.
We delivered over 4,200 courses to 63,500 professionals in our centers.
We delivered 1,200 courses to 18,240 corporate employees on Site.
