Food Hygiene
Health & Safety
Safeguarding
First Aid
Business Skills
Personal Development
GET THIS COURSE AND 2500+ OTHERS FOR ONLY £49 FIND OUT MORE
The Front-End Web Developer Bootcamp: HTML, CSS, JS & React teaches you everything on the topic thoroughly from scratch so you can achieve a professional certificate for free to showcase your achievement in professional life. This The Front-End Web Developer Bootcamp: HTML, CSS, JS & React is a comprehensive, instructor-guided course, designed to provide a detailed understanding of the nature of the related sector and your key roles within it.
To become successful in your profession, you must have a specific set of skills to succeed in today’s competitive world. In this in-depth training course, you will develop the most in-demand skills to kickstart your career, as well as upgrade your existing knowledge & skills.
The training materials of this course are available online for you to learn at your own pace and fast-track your career with ease.
- Accredited by CPD
- Instant e-certificate and hard copy dispatch by next working day
- Fully online, interactive course with audio voiceover
- Self-paced learning and laptop, tablet, smartphone-friendly
- 24/7 Learning Assistance
- Discounts on bulk purchases
Sneak Peek
Who should take the course
Anyone with a knack for learning new skills can take this The Front-End Web Developer Bootcamp: HTML, CSS, JS & React. While this comprehensive training is popular for preparing people for job opportunities in the relevant fields, it also helps to advance your career for promotions.
Certification
Once you’ve successfully completed your course, you will immediately be sent a digital certificate. Also, you can have your printed certificate delivered by post (shipping cost £5.99). All of our courses are fully accredited, providing you with up-to-date skills and knowledge and helping you to become more competent and effective in your chosen field. Our certifications have no expiry dates, although we do recommend that you renew them every 12 months.
Accreditation
All of our courses, including this The Front-End Web Developer Bootcamp: HTML, CSS, JS & React, are fully accredited, providing you with up-to-date skills and knowledge and helping you to become more competent and effective in your chosen field.
Course Curriculum
The detailed curriculum outline of our The Front-End Web Developer Bootcamp: HTML, CSS, JS & React is as follows:
- Introduction
- Features of HTML5
- Benefits of using HTML5
- Where and how is HTML5 used?
- HTML5 editors
- Downloading Visual Studio Code
- Course Materials
- What are HTML tags?
- Structure of an HTML5 file
- File and folder structure
- How to create an HTML5 file?
- Heading Tags in HTML
- HTML5 Quotation and Citation tags
- Commenting out code in HTML5
- HTML5 attributes
- How to style in HTML5
- What are anchor tags?
- What are image tags?
- What are paragraph tags?
- What are break tags?
- What are table tags?
- List Tags
- Video Tag
- Audio Tag
- Form tags
- Input Types
- Input attributes (size, read-only, disabled)
- Additional input attributes (Min, max, multiple, and placeholder)
- Required Inputs
- Introduction
- Examining Block and Inline Elements
- Conclusion
- Introduction to CSS3
- Syntax of CSS3
- Uses of CSS3
- Types of CSS3
- Selectors & Colors in CSS3
- Background
- Borders
- Outline
- Height and width
- Margin and padding
- Text alignment
- Text decoration
- Text transform
- Text spacing
- Font family
- How to use font awesome icons
- Display
- Positions
- Z-index
- Overflow
- Float
- DOM Model in CSS
- Advanced Selectors
- Pseudo-classes Part 1
- Pseudo-classes part 2
- Pseudo-Elements
- Opacity and important
- Border-radius
- Box Shadow
- Grid System
- Flexbox
- Media Queries
- Mini Project
- Introduction and History of JavaScript
- Syntax of JavaScript and overview
- JavaScript Implementation
- How to use HTML tags in JavaScript
- Var in JavaScript
- Global and local var in JavaScript
- Advanced console.log
- If statement
- If else statement
- Condition ternary statement
- Switch statement
- If else if statement
- Break and continue statement
- Data types
- Arithmetic operator
- Assignment operator
- Comparison operator
- Alert boxes
- Confirm box
- Prompt box
- Functions
- Functions with parameters
- Function with return
- Events in JavaScript
- While loop
- Do while loop
- For loop
- Nested loop
- Arrays
- Modify and delete arrays
- Sort and revers methods
- Pop and push methods
- Shift and unshift method
- Concat and join method
- Slice and splice method
- The isArray method
- Indexof and lastindex method
- The forEach method
- The toString() valueOf() and fill() methods
- Include methods
- Some and every method
- Find and findindex method
- Filter method
- Objects
- Arrays objects
- For in loop
- String methods – Part 1
- String methods – Part 2
- String methods – Part 3
- Number Methods
- Math Method – Part 1
- Math Method – Part 2
- Date method
- Dom Model
- Dom other objects
- Dom get methods
- Dom styling
- addEventListener (Events)
- useCapture
- classList method
- Parent nodes
- Children nodes
- First and last child
- Next and previous siblings
- Create element text node
- Append child and insert before
- Insert adjacent element and insert adjacent HTML
- Conclusion JavaScript
- Introduction to React.JS
- First React App
- JSX In React.JS
- Inline and Internal Styling in React.JS
- Template literals in React.JS
- Components in React.JS
- Props in React.JS
- Hooks in Reacts.JS
- Understanding hierarchy in React.JS
- Conditional rendering
- useEffect Hook in React.JS
- React-Router-Dom
- Linking in react-router-dom
- Handling Error Pages with react-router-dom
- Using the useNavigate() hook
- First Project (Part 1)
- First Project (Part 2)
- Building a Calculator – Part 1
- Building a Calculator – Part 2
- Building a Restful API in React.JS – Part 1
- Building a Restful API in React.JS – Part 2
- Building a Restful API in React.JS – Part 3
- Using array.map() inside JSX elements
- How to use Material UI in React.JS
- Conclusion
Course Curriculum
| Introduction to HTML5 | |||
| Introduction | 00:02:00 | ||
| Features of HTML5 | 00:01:00 | ||
| Benefits of using HTML5 | 00:01:00 | ||
| Where and how is HTML5 used? | 00:01:00 | ||
| HTML5 editors | 00:01:00 | ||
| Downloading Visual Studio Code | 00:02:00 | ||
| Course Materials | 00:00:00 | ||
| Structure of an HTML5 | |||
| What are HTML tags? | 00:02:00 | ||
| Structure of an HTML5 file | 00:03:00 | ||
| File and folder structure | 00:01:00 | ||
| How to create an HTML5 file? | 00:02:00 | ||
| HTML5 basic building blocks | |||
| Heading Tags in HTML | 00:03:00 | ||
| HTML5 Quotation and Citation tags | 00:04:00 | ||
| Commenting out code in HTML5 | 00:02:00 | ||
| HTML5 attributes | 00:02:00 | ||
| How to style in HTML5 | 00:02:00 | ||
| Exploring HTML5 | |||
| What are anchor tags? | 00:04:00 | ||
| What are image tags? | 00:06:00 | ||
| What are paragraph tags? | 00:03:00 | ||
| What are break tags? | 00:02:00 | ||
| What are table tags? | 00:06:00 | ||
| List Tags | 00:04:00 | ||
| Video Tag | 00:03:00 | ||
| Audio Tag | 00:01:00 | ||
| Building a Form from Scratch with HTML5 | |||
| Form tags | 00:06:00 | ||
| Input Types | 00:07:00 | ||
| Input attributes (size, read-only, disabled) | 00:03:00 | ||
| Additional input attributes (Min, max, multiple, and placeholder) | 00:04:00 | ||
| Required Inputs | 00:01:00 | ||
| Block and Inline Elements | |||
| Introduction | 00:02:00 | ||
| Examining Block and Inline Elements | 00:13:00 | ||
| Conclusion (HTML5 Part) | |||
| Conclusion | 00:01:00 | ||
| Introduction to CSS3 | |||
| Introduction to CSS3 | 00:02:00 | ||
| Syntax of CSS3 | 00:01:00 | ||
| Uses of CSS3 | 00:04:00 | ||
| Types of CSS3 | 00:07:00 | ||
| Selectors & Colors in CSS3 | 00:08:00 | ||
| Basics Properties of CSS3 | |||
| Background | 00:12:00 | ||
| Borders | 00:04:00 | ||
| Outline | 00:02:00 | ||
| Height and width | 00:04:00 | ||
| Margin and padding | 00:06:00 | ||
| Typography Properties of CSS3 | |||
| Text alignment | 00:03:00 | ||
| Text decoration | 00:03:00 | ||
| Text transform | 00:03:00 | ||
| Text spacing | 00:03:00 | ||
| Font family | 00:07:00 | ||
| How to use font awesome icons | 00:05:00 | ||
| Selectors Properties in Depth of CSS3 | |||
| Display | 00:02:00 | ||
| Positions | 00:06:00 | ||
| Z-index | 00:01:00 | ||
| Overflow | 00:03:00 | ||
| Float | 00:02:00 | ||
| DOM Model in CSS | 00:02:00 | ||
| Advanced Selectors | 00:07:00 | ||
| Pseudo-classes Part 1 | 00:10:00 | ||
| Pseudo-classes part 2 | 00:05:00 | ||
| Pseudo-Elements | 00:04:00 | ||
| Extra features in CSS3 | |||
| Opacity and important | 00:03:00 | ||
| Border-radius | 00:03:00 | ||
| Box Shadow | 00:03:00 | ||
| Responsive Design with CSS3 | |||
| Grid System | 00:11:00 | ||
| Flexbox | 00:07:00 | ||
| Media Queries | 00:04:00 | ||
| Mini Project | |||
| Mini Project | 00:15:00 | ||
| Introduction to JavaScript | |||
| Introduction and History of JavaScript | 00:03:00 | ||
| Syntax of JavaScript and overview | 00:04:00 | ||
| JavaScript Implementation | 00:02:00 | ||
| How to use HTML tags in JavaScript | 00:02:00 | ||
| Variables | |||
| Var in JavaScript | 00:07:00 | ||
| Global and local var in JavaScript | 00:03:00 | ||
| Advanced console.log | 00:03:00 | ||
| Statements in JavaScript | |||
| If statement | 00:02:00 | ||
| If else statement | 00:02:00 | ||
| Condition ternary statement | 00:03:00 | ||
| Switch statement | 00:03:00 | ||
| If else if statement | 00:03:00 | ||
| Break and continue statement | 00:04:00 | ||
| Data types | 00:05:00 | ||
| Operators in JavaScript | |||
| Arithmetic operator | 00:05:00 | ||
| Assignment operator | 00:02:00 | ||
| Comparison operator | 00:04:00 | ||
| Popup Boxes in JavaScript | |||
| Alert boxes | 00:02:00 | ||
| Confirm box | 00:01:00 | ||
| Prompt box | 00:02:00 | ||
| Functions | 00:03:00 | ||
| Functions with parameters | 00:02:00 | ||
| Function with return | 00:05:00 | ||
| Events in JavaScript | |||
| Events in JavaScript | 00:05:00 | ||
| Loops in JavaScript | |||
| While loop | 00:05:00 | ||
| Do while loop | 00:03:00 | ||
| For loop | 00:03:00 | ||
| Nested loop | 00:03:00 | ||
| Arrays in JavaScript | |||
| Arrays | 00:06:00 | ||
| Modify and delete arrays | 00:02:00 | ||
| Sort and revers methods | 00:03:00 | ||
| Pop and push methods | 00:02:00 | ||
| Shift and unshift method | 00:02:00 | ||
| Concat and join method | 00:03:00 | ||
| Slice and splice method | 00:04:00 | ||
| The isArray method | 00:02:00 | ||
| Indexof and lastindex method | 00:03:00 | ||
| The forEach method | 00:02:00 | ||
| The toString() valueOf() and fill() methods | 00:02:00 | ||
| Include methods | 00:02:00 | ||
| Some and every method | 00:03:00 | ||
| Find and findindex method | 00:02:00 | ||
| Filter method | 00:02:00 | ||
| Objects and their methods | |||
| Objects | 00:10:00 | ||
| Arrays objects | 00:04:00 | ||
| For in loop | 00:03:00 | ||
| String and its methods | |||
| String methods – Part 1 | 00:05:00 | ||
| String methods – Part 2 | 00:04:00 | ||
| String methods – Part 3 | 00:10:00 | ||
| JavaScript Number Methods | |||
| Number Methods | 00:08:00 | ||
| Math Method – Part 1 | 00:08:00 | ||
| Math Method – Part 2 | 00:08:00 | ||
| Date method | 00:05:00 | ||
| DOM Model | |||
| Dom Model | 00:04:00 | ||
| Dom other objects | 00:09:00 | ||
| Dom get methods | 00:06:00 | ||
| Dom styling | 00:07:00 | ||
| addEventListener (Events) | 00:04:00 | ||
| useCapture | 00:04:00 | ||
| classList method | 00:08:00 | ||
| Parent nodes | 00:05:00 | ||
| Children nodes | 00:04:00 | ||
| First and last child | 00:03:00 | ||
| Next and previous siblings | 00:02:00 | ||
| Create element text node | 00:03:00 | ||
| Append child and insert before | 00:03:00 | ||
| Insert adjacent element and insert adjacent HTML | 00:05:00 | ||
| Conclusion | |||
| Conclusion JavaScript | 00:07:00 | ||
| Introduction to React: A JS library for building user interfaces | |||
| Introduction to React.JS | 00:06:00 | ||
| First React App | 00:10:00 | ||
| JSX In React.JS | 00:04:00 | ||
| Styling Components Hooks | |||
| Inline and Internal Styling in React.JS | 00:05:00 | ||
| Template literals in React.JS | 00:06:00 | ||
| Components in React.JS | 00:06:00 | ||
| Props in React.JS | 00:07:00 | ||
| Hooks in Reacts.JS | 00:03:00 | ||
| Hierarchy rendering & advanced hooks | |||
| Understanding hierarchy in React.JS | 00:06:00 | ||
| Conditional rendering | 00:04:00 | ||
| useEffect Hook in React.JS | 00:02:00 | ||
| DOM | |||
| React-Router-Dom | 00:04:00 | ||
| Linking in react-router-dom | 00:03:00 | ||
| Handling Error Pages with react-router-dom | 00:03:00 | ||
| Using the useNavigate() hook | 00:02:00 | ||
| Projects | |||
| First Project (Part 1) | 00:09:00 | ||
| First Project (Part 2) | 00:03:00 | ||
| Building a Calculator App | |||
| Building a Calculator – Part 1 | 00:03:00 | ||
| Building a Calculator – Part 2 | 00:03:00 | ||
| Using the Pokémon API | |||
| Building a Restful API in React.JS – Part 1 | 00:03:00 | ||
| Building a Restful API in React.JS – Part 2 | 00:05:00 | ||
| Building a Restful API in React.JS – Part 3 | 00:05:00 | ||
| Using array.map() inside JSX elements | 00:05:00 | ||
| How to use Material UI in React.JS | 00:06:00 | ||
| Conclusion | |||
| Conclusion | 00:03:00 | ||
£20
ex Vat
TAKE THIS COURSE
SAVE 84% - OFFER ENDS SOON
- Original price was: £125.00.£20.00Current price is: £20.00. ex Vat
- 1 year
- Intermediate
- Course Certificate
- 10 hours, 43 minutes Gift this course
Buying more than one of the same courses?
- 50% discount for orders of 10+ courses
- 60% discount for orders of 50+ courses
- 70% discount for orders of 100+ courses
Looking for a more personalised package?
contact us nowInstructors
22 STUDENTS ENROLLED
