Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/zee-bit/zee-bit.github.io
https://github.com/zee-bit/zee-bit.github.io
Last synced: 5 days ago
JSON representation
- Host: GitHub
- URL: https://github.com/zee-bit/zee-bit.github.io
- Owner: zee-bit
- Created: 2020-06-27T21:33:47.000Z (over 4 years ago)
- Default Branch: master
- Last Pushed: 2020-12-25T19:18:23.000Z (almost 4 years ago)
- Last Synced: 2023-10-20T08:28:41.368Z (about 1 year ago)
- Language: HTML
- Homepage:
- Size: 2.47 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
## Day 1
- [x] Make sure you have gone through this before entering here.
- [x] Make a new GitHub Repository with name **your_username.github.io** on your GitHub account.
- [x] Initialize this New Folder as a Git Repository.
- [x] Push the contents to your new repository (**your_username.github.io**)![](../memes/m8.jpeg)
## Day 2
- [x] Start Learning HTML from
- w3schools
- MDN web docs
- List of important tags :
- [x] Heading tags
- [x] Paragraph tag
- [x] Anchor tag
- [x] List tags
- [x] Image tag
- [x] Form tags
- [x] Table tags
- [x] Meta tag, etc.
- [x] Make changes in the index.html page of your repository.
- [x] Commit and push the changes to your repository.![](../memes/m5.jpeg)
## Day 3
- [x] Get acquainted with CSS
Resource Links :
- w3schools
- MDN web docs
- List of important topics to learn in CSS :
- [x] Different type of Stylesheets
- [x] Selectors
- [x] Basic Styling such as font-size, width, etc.
- [x] Color formats
- [x] Box Model
- [x] Display, Positon and Float
- [x] Psuedo Classes and Combinators
- [x] Fluid Layouts
- [x] Media Queries
- [x] Flexbox and Grids
- [x] Transforms, Transitions and Animations
- [x] You can also learn about CSS Frameworks like Bootstrap![](../memes/m13.jpeg)
## Day 4
- [x] Start adding some CSS to your project. Keep all the css in **/assets/css/** folder.
- [x] You can also use Bootstrap or any other Framework for styling.
- [x] Add the CSS file in your index.html using **link** tag- [x] Create atleast one animation, transformation and transition using only CSS.
- [x] Use Flexbox atleast for one section.
- [x] Use Psuedo Classes atleast once.
- [x] Use Descendant Selector atleast once.
- [x] Make the website responsive.- [x] So, that's a lot of learning for 3 days straight. Go watch this, have a coffee and get back because **CODERS NEVER QUIT, QUITTERS NEVER CODE**
## Day 5(JS)
![](../memes/m6.jpeg)
- [x] Start Learning Javascipt from
- MDN Web Docs
- Eloquent Javascript Book for reference
- List of important topics to learn in Javascipt :
- [x] Types, Variables and Scoping
- [x] Objects and Functions
- [x] The DOM
- [x] Events and EventListeners
- [x] Flow Control
- [x] ES6, etc
- [x] You can also learn about any Javascipt Frameworks like JQuery, React, etc
## Day 6 (JS)
- [x] Start adding JS to your project. Keep all the JS in **/assets/js/** folder.
- [x] You can also use JQuery or any other Framework for styling.
- [x] Add the JS script in your index.html using **script** tag- [x] Create atleast
- [x] Two of these animations by DOM manipulation using Javascript -
- [ ] Fade-Effect
- [x] Roll-in or Roll-out
- [x] Page-In or Page-out
- [ ] Object Movements
- [ ] Fireworks
- [x] Two EventListeners for events like Click, KeyDown, Resize, etc.
![](../memes/m3.jpeg)## Day 7
- [x] Make any final changes in your website, you still have time.
- [x] Make sure GitHub pages is enabled for your repository. Go here to get help with this
- [x] Visit **your_username.github.io**. That should be your portfolio.
- [x] Keep the forked repository in sync with the actual repository. Refer this.
- [x] In the synced fork on your repository, edit the README.md file to add your Name and the link to your portfolio.
- [x] Then make a Pull Request to the Repository on EEESoc Organisation from which you had first forked.![](../memes/m10.jpeg)
### Note:
- Maintain a track of everything that you have learnt in progress.md file.
- Download any code editor of your choice (for example vscode, sublime, brackets etc.)