code-it-now-or-never

Hi,

Here is the very first project I build to learn HTML, CSS, and javascript.

I'll spend 7-10 hours every week to learn.

I wanna record this whole process since this is my first time to face it so seriously. Publishing it will keep me go on this project. So that's why you see it.

I just started on March 10. Let's see how far I'll go.

W1 - 3/10

• Basic HTML tag(H1, div, form, table etc.)
• HTML5 tag(Header, nav, main)
• Facebook Fanpage & Google map inserted
• Basic CSS (font, background)

materials: Introduction to HTML5

The result of W1: Calendar

W2 - 3/18

• Web font use
• CSS selector
• Box model
• Position
• Display
• Git

materials: 牢记 31 种 CSS 选择器用法、連猴子都能懂得 Git 入門指南

W3 - 4/1

• Flex box
• CSS Selectors Pseudo-elements(::before)
• CSS Media Queries
• Transition

materials: Learn Flexbox for Free、Flex 布局教程：语法篇、Flex 布局教程：实例篇、CSS Media Queries 介紹與基礎應用

W4 - 4/15

• CSS Animation
• JavaScript (data type;variable;operatore;function;loop)

materials: 重新認識 JavaScript 系列、語言技術：JavaScript Essence

W5 - 6/3

• Bootstrap (grid; drawer;forms)

materials: Bootstrap、Bootstrap 4 TC version、Bootstrap Material Design

the result: My own GitHub Page

W6 - 6/24

• Bootstrap (modal; reordering; collapse; snackbar)

the result: Jioukou Product Prototype

W7 - 7/19

• JavaScript (data type;variable;operator;function)

materials: Letfreecode - study materials

W8 - 7/22

• Git(command, pull, push, rebase)
• CI/CD
• MVC
• Ruby on Rails

materials: 為自己學 Rails

the result: Mumu's offcial website

W9 - 7/26 & 8/2

• ES6 elements (const / let)
• loop

W10 - 8/5

• Gatsby.js
• Compiler
• Webpack

W11 - 11/10

• MJML

W12 - 11/14

• Next.js