FrontEnd Summer Training August-2021

This Repo will contain all tasks taken in ITI FrontEnd Summer Training

For sure there are best ways to write better code for given tasks , but the challenge is to make the same as layout with given tools and not use advanced tools

Training Content

• Day 01
  • How Internet works ?
  • HTML History
  • HTML Tags

---

• Day 02
  • Img tag
    • maps in img
  • Tables
  • Links
  • Forms

---

• Day 03
  • Intro to CSS2
  • Some CSS2 Properties
    • color , font , border , margin , padding
    • display ( inline-block ) for making layouts

---

• Day 04
  • Intro to javascript
  • History of javascript
  • ECMA5
  • Variables , Functions , Conditions , Loops
  • Hoisting
    • For both variables , functions

---

• Day 05
  • cont. in javascript
  • scooping
  • string
    • string built in functions
  • math
  • date

---

• Day 06
  • cont. in javascript
  • Array
  • Array built in methods
    • pop , push , shift , unshift
    • filter
    • every , some
    • join , concat
    • sort

---

• Day 07
  • cont. in javascript
  • What is DOM ?
  • Dom Manipulation
  • Dom selectors

---

• Day 08
  • cont. in javascript
  • Dom manipulations
  • Dom selectors
  • Events

---

• Day 09
  • cont. in javascript
  • cont. in Dom Events
  • javascript OOP

---

• Day 10
  • Intro to Jquery
  • Why Jquery?
  • Jquery selectors
  • Some built in functions
    • show()
    • hide()
    • addClass()
    • removeClass()
    • toggleClass()

---

• Day 11
  • cont. in jquery
  • how to bind events with jquery functions
    • .bind() , .delegate() [deprecated]
    • .on()
  • delegation
  • bubbling
    • .stopPropagation
  • ui effect fuctions
    • animation function

---

• Day 12

  • cont. in jquery

    • Traversing
      • .parent , .parents
      • .next , .nextAll
      • .prev ,.prevAll
      • .children
      • .is , .map , .find
      • .attr

  • Jquery UI

  • ECMA Script 6

    • Arrow Functions
    • Spread & Rest operators
    • Template literal

---

• Day 13
  • cont. in ES6
  • Object with ES6
  • factory function => JS design pattern
  • consice function
  • Class in ES6..
    • constructor()
    • inhertance
    • super()
    • ES6 modules
      • import
      • export

---

• Day 14
  • Intro to React
  • How to create React Enviroment
  • JSX
    • javascript embeded html
  • Function Components
  • Built a Simple layout using Function components

---

• Day 15
  • cont. in React
  • conditional Rendering
  • class component
  • CRUD operations using react

---

• Day 16
  • cont. in react
  • React Router
  • CRUD operations using React-Router

---

• Day 17
  • Cont. in React
  • importing Bootstrap
  • importing other UI Libraries
    • Material UI , Anti UI
  • Dealing with Api
    • using Axios , Fetch

---

• Day 18
  • Cont. in React
  • create Fake Server
  • Deal with data in a Crud React App
    • using axios

    • Command	Axios Method	Parameter
      Delete	delete	ID
      Edit	put	Object + ID
      Add	post

---

• Day 19
  • Bootstrap4
  • Grid system
  • Typography
  • buttons
  • badges
  • Pagination
  • progress bars

---

• Day 20
  • Graduation Project
  • Duration : 2 weeks
  • Done in : 6 Days - 9 hours/day

---

End of Training 🤓