By GokiSoft.com| 15:57 20/12/2021|
Học HTML5 - CSS3

[Video] Giới thiệu về web + tạo web cơ bản + git/github - Phát hành dự án - Lập trình HTML/CSS


#readme.txt


Nội dung kiến thức học:
- Giới thiệu qua về web & các môn học liên quan
	- hosting/server -> đăng ky thử 1 hosting/server -> 000webhost, heroku, .v.v
	- domain/dns -> đăng ký thử 1 tên miền free
	- kết nối hosting/server & domain/dns
- Cài đặt môi trường
	- Phạm vi học: HTML/CSS/JS -> bien dich voi browser (chrome, cốc cốc, ie, safari, .v.v.)
	- Môi trường:
		- IDE: Visual Studio, Webstorm, Jetbrain, ..., sublime text 4
		- Sublime text: https://www.sublimetext.com/download
- Một số lưu ý khi phát triển website:
	- Mỗi 1 project -> tạo 1 folder
		- Phân cấp bài học -> thành các folder con (Giống C)
		- Nguyên tắc khi làm việc với web
			- Tất cả file hình ảnh, source code, .v.v -> để trong folder dự án
			- Đặt tên folder + tên file -> tiếng ánh/tiếng việt ko dấu -> ko có khoảng cách -> sử dụng dấu - hoặc _ => tạo folder/file
			- Viết chức thường (ko sử dụng chữ hoa trong phát triển web)
- Phát triển dự án web cơ bản
	- Tìm hiểu hiểu HTML
	- Phương pháp học:
		- Ghi nhớ nhiều -> qua thực hành
	- Tài liệu học:
		- EN: https://www.w3schools.com/html/default.asp
		- VN: https://gokisoft.com/hoc-html5-css3.htm
		- Slide Aptech -> dùng thi lý thuyết
	- Học cách tạo 1 website cơ bản:
- Deploy (phát hành) dự án -> đẩy lên git/github & public website
	B1. Tạo tài khoản trên github: https://github.com/
	B2. Cài đặt phầm mềm: https://git-scm.com/
	B3. Đẩy code từ máy tính lên github
		B3.1 -> TH: chưa đẩy code lên lần nào
			git init
			git add -A
			git commit -m 'first commit'
			git remote add origin https://github.com/tranvandiep/C2110I.git
			git push origin master
		B3.2 -> TH: đã từng đẩy code lên github
			git add -A
			git commit -m 'update source code for lesson01'
			git push origin master
	B4. Deploy du an/tạo web -> share cho mọi người xem kết quả học


#test.html


<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<title>Test Page</title>
</head>
<body>
<h1>Test</h1>
</body>
</html>


#vidu.html


<!-- Khai báo trang web code bằng html -> thông báo cho browser biết -->
<!-- Tag/Thẻ: html, head, meta, body, h1, .v.v => có 1 chức năng riêng => Biên bởi browser -->
<!-- Tag/Thẻ: Thẻ mở <html> & thẻ đóng </html>, Thẻ tự đóng: <meta> -->
<!DOCTYPE html>
<html>
<head>
	<!-- header: khai báo thẻ cấu hình, thuộc tính web, ... -->
	<!-- Thẻ này báo browser -> site gõ bằng font utf8 -->
	<meta charset="utf-8">
	<!-- Cho chức năng responsive: mobile & pc (@meta) -->
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<!-- Tiêu đề website -->
	<title>HTML for beginer</title>
</head>
<!-- keyword: color picker -->
<body style="color: white; background-color: #c5fce9; background-image: url(https://haycafe.vn/wp-content/uploads/2021/12/hinh-anh-noel-giang-sinh-dep-nhat.jpg);">
	<!-- body: thiết kế giao diện website -->
	<!-- Tạo ra text bôi đậm -->
	<h1 title="Xin Chao">Welcome to learn HTML/CSS</h1>
	<h2>Welcome to learn HTML/CSS</h2>
	<h3>Welcome to learn HTML/CSS</h3>
	<h4>Welcome to learn HTML/CSS</h4>
	<h5>Welcome to learn HTML/CSS</h5>
	<h6>Welcome to learn HTML/CSS</h6>
	<h7>Welcome to learn HTML/CSS</h7>
	<h8>Welcome to learn HTML/CSS</h8>
	<br/><br>
	<!-- src, alt -> gọi là thuộc tính/properties -->
	<!-- https://en.nhandan.vn/cdn/en/media/k2/items/src/996/0a643cbb6c8121a7d309c2e1a984eac8.jpg, GokiSoft - Học Lập Trình Online -> Giá trị/value của thuộc tính -->
	<img src="https://en.nhandan.vn/cdn/en/media/k2/items/src/996/0a643cbb6c8121a7d309c2e1a984eac8.jpg" alt="GokiSoft - Học Lập Trình Online" width="600px" height="auto">
	<br/>
	<a href="https://gokisoft.com">Xem web gokisoft.com</a>
</body>
</html>


Tags:

Phản hồi từ học viên

5

(Dựa trên đánh giá ngày hôm nay)