Học JavaScript trong 30 ngày GitHub

Các nhà phát triển và nhà thiết kế từ Sơ cấp đến Trung cấp muốn làm quen với cả nguyên tắc cơ bản về JavaScript và làm việc trong DOM mà không cần thư viện

Bạn nên biết một số JavaScript để bắt đầu - Đây không phải là khóa học JavaScript 101. Nếu bạn chưa quen với JavaScript hoặc muốn làm quen với các nguyên tắc cơ bản, tôi khuyên bạn nên sử dụng BeginnerJavaScript của tôi. khóa học com - sử dụng mã JAVASCRIPT30 để được giảm thêm $10

Chúng tôi học bằng ứng dụng - gặp nhiều tình huống mới trong khi nói về cách thức, lý do tại sao và những gì chúng tôi sử dụng để giải quyết chúng

Chúng tôi tránh xa các mẫu thiết kế cố chấp, khuôn khổ, thư viện và bất kỳ loại trừu tượng nào. Những điều này rất tuyệt và thường cần thiết, nhưng có thể cản trở việc học và hạn chế hiểu biết ban đầu

Các hướng dẫn này chủ yếu dựa vào API trình duyệt, hầu hết liên quan đến tương tác với trang. Nếu bạn đang mắc kẹt ở vùng đất console.log(), những video này là bước tiếp theo của bạn. Ồ, những thứ chúng tôi xây dựng thực sự thú vị

javascript css html thuật toán flex cơ sở dữ liệu devtools html-canvas vanilla-javascript javascript30 wesbos videoplayer css-variables js-clock drum-kit cornify key-sequence

  • Cập nhật21/09/2021
  • HTML

rohitkrai03 / JavaScript30

Sao 4

  • Mã số
  • Vấn đề
  • Yêu cầu kéo

Giải pháp của tôi cho khóa học JavaScript của @wesbos

javascript vani-js javascript30

  • Cập nhật ngày 7 tháng 5 năm 2018
  • HTML

msgtobala / Sách của tôi

Sao 4

  • Mã số
  • Vấn đề
  • Yêu cầu kéo

Kho lưu trữ Markdown cho ghi chú

nodejs javascript css phi tiêu graphql markdown express sợi phản ứng gốc mongodb ubuntu ghi chú reactjs regex gatsby es6-javascript javascript30 rung javascipt dart2

Chúc mừng bạn đã quyết định tham gia 30 ngày thử thách lập trình React. Trong thử thách này, bạn sẽ học mọi thứ bạn cần sử dụng để phát triển ứng dụng React. Khi kết thúc thử thách, bạn sẽ nhận được chứng chỉ hoàn thành thử thách lập trình 30DaysOfReact. Trong trường hợp bạn cần giúp đỡ hoặc nếu bạn muốn giúp đỡ người khác, bạn có thể tham gia nhóm điện tín

Thử thách 30DaysOfReact là hướng dẫn dành cho cả người mới bắt đầu và nhà phát triển JavaScript và React nâng cao. Chào mừng đến với 30 ngày phản ứng. React là một thư viện JavaScript. Tôi thích sử dụng và dạy React và tôi hy vọng bạn cũng vậy. Trong thử thách React 30 ngày từng bước này, bạn sẽ học React, một trong những thư viện JavaScript giao diện người dùng phổ biến nhất. React có thể làm mọi thứ mà JavaScript có thể làm. React có thể được sử dụng để thêm tính tương tác vào trang web, để phát triển ứng dụng di động, ứng dụng máy tính để bàn, trò chơi. Tôi tin rằng bạn sẽ học được khá nhiều trong 30 ngày tới và kỹ năng lập trình và giải quyết vấn đề của bạn cũng sẽ được cải thiện đáng kể

Tôi sẽ sử dụng tiếng Anh đàm thoại và ít biệt ngữ hơn để viết thử thách này. Nội dung sẽ được cập nhật liên tục. Nếu bạn tìm thấy lỗi đánh máy hoặc lỗi ngữ pháp, đừng ngạc nhiên vì tôi không đọc bất kỳ bản kiểm chứng nào trước khi xuất bản nó. Tôi khuyên bạn nên tập trung vào thông điệp chính của thử thách thay vì tiếng Anh và một số lỗi nhỏ. Tôi thực sự đánh giá cao nếu bạn gửi cho tôi các yêu cầu kéo để cải thiện và nhớ lấy từ chủ trước khi bạn gửi yêu cầu kéo. Hầu hết các hình ảnh tôi đã sử dụng trong thử thách này đến từ thử thách 30DaysOfJavaScript, do đó bạn có thể cần đổi tên tên tệp và thư mục thành 30DaysOfReact. Nếu bạn giỏi về mảng, vòng lặp, hàm, đối tượng, lập trình hàm, phá hủy và trải rộng và lớp thì bạn sẽ có thể thực hiện đúng thử thách. Mặt khác, tôi thực sự khuyên bạn nên kiểm tra 30DaysOfJavaScript

Trước khi đi sâu vào khóa học này, bạn có thể kiểm tra đánh giá về 30 Days Of React

Yêu cầu

Để hòa đồng với thử thách bạn cần có những điều sau

  1. Động lực
  2. một máy tính
  3. Internet
  4. một trình duyệt
  5. Trình chỉnh sửa mã
  6. Kỹ năng trình độ trung cấp HTML, CSS và JavaScript

Cách sử dụng Repo

Sao và Fork Repo này

Gắn dấu sao cho repo này để hỗ trợ công việc này và Fork repo để tạo bản sao của riêng bạn để làm việc từ đó

Sao chép ngã ba của bạn

Bạn phải luôn làm việc trực tiếp từ bản sao rẽ nhánh của mình

# note that an `ssh` link is used here, but an `https` link will work the same
git clone [email protected]:username/30-Days-Of-React.git
cd 30-Days-Of-React

Tạo một chi nhánh mới

Để hoàn thành các bài tập hàng ngày, đề xuất của tôi là tạo một nhánh riêng để chứa thư mục bài tập của bạn hoặc bất kỳ thay đổi nào khác mà bạn thực hiện. Điều này sẽ giữ cho nhánh chính của bạn luôn sạch sẽ, điều đó có nghĩa là nhánh chính của bạn sẽ luôn giống với nhánh gốc

git checkout -b exercise-solutions # `-b` creates the branch if it does not exist

Giải pháp bài tập cấu trúc

Trong nhánh mới của bạn, bạn có thể sử dụng các tệp/thư mục để cấu trúc các giải pháp của mình cho các bài tập hàng ngày

mkdir -p solutions/day-01 # `-p` helps create nested directories
touch solutions/day-01/level1.js # touch creates a file

Cam kết giải pháp tập thể dục

Cam kết các giải pháp của bạn cho Fork của bạn

git add solutions/day-01/level1.js
git commit -m "chore: exercise level1 complete"
git push origin exercise-solutions # branch `exercise-solutions` was created earlier

Cập nhật Fork của bạn hàng ngày

Repo này sẽ được cập nhật hàng ngày trong suốt tháng. Khi có nội dung của một ngày mới, bạn có thể cập nhật bản sao đã chia đôi của mình bằng các bước bên dưới

# 1. switch to master branch
git checkout master
# 2. check if your local copy has a link to original `...Asabeneh/30-Days-Of-React.git`
git remote -v
# 3. if not, add a link to original, you can choose any name for the link or use `upstream`
git remote add upstream [email protected]:Asabeneh/30-Days-Of-React.git
# 4. check again to confirm link added
git remote -v
# 5. now you can fetch updates from original repo, assuming you named this `upstream`
git fetch upstream
# 6. merge the updates to your local master branch
git merge upstream/master master
# 7. push the merged updates to your Forked copy on GitHub
git push origin master

Lưu ý rằng các bản cập nhật chỉ được áp dụng cho nhánh chính. Nếu bạn muốn cập nhật bất kỳ nhánh nào khác, hãy lặp lại các bước 6-7 với tên nhánh. Xem đoạn trích bên dưới để biết chi nhánh

git checkout -b exercise-solutions # `-b` creates the branch if it does not exist
4

git merge upstream/master exercise-solutions
git push origin exercise-solutions

Cài đặt

Tôi tin rằng bạn có động lực và khát khao mãnh liệt trở thành nhà phát triển, máy tính và Internet. Ngoài HTML, CSS và JS từ cơ bản đến trung cấp. Nếu bạn có những thứ đó, thì bạn có mọi thứ để bắt đầu

Cài đặt nút. js

Bạn có thể không cần nút. js ngay bây giờ nhưng bạn có thể cần nó sau này. Cài đặt nút. js

Học JavaScript trong 30 ngày GitHub

Sau khi tải về click đúp và cài đặt

Học JavaScript trong 30 ngày GitHub

Chúng tôi có thể kiểm tra xem nút có được cài đặt trên máy cục bộ của mình hay không bằng cách mở thiết bị đầu cuối thiết bị hoặc dấu nhắc lệnh

asabeneh $ node -v
v12.14.0

Khi thực hiện hướng dẫn này, tôi đã sử dụng nút phiên bản 12. 14. 0, nhưng bây giờ là phiên bản được đề xuất của nút. js để tải xuống là 12. 17. 0

trình duyệt

Có rất nhiều trình duyệt ngoài kia. Tuy nhiên, tôi thực sự khuyên dùng Google Chrome

Cài đặt Google Chrome

Cài đặt google chrome nếu bạn chưa có. Chúng tôi có thể viết mã JavaScript nhỏ trên bảng điều khiển trình duyệt, nhưng chúng tôi không sử dụng bảng điều khiển trình duyệt để phát triển ứng dụng

Học JavaScript trong 30 ngày GitHub

Mở bảng điều khiển Google Chrome

Bạn có thể mở bảng điều khiển Google Chrome bằng cách nhấp vào ba dấu chấm ở góc trên cùng bên phải của trình duyệt, chọn Công cụ khác -> Công cụ dành cho nhà phát triển hoặc sử dụng phím tắt. Tôi thích sử dụng phím tắt hơn

Học JavaScript trong 30 ngày GitHub

Để mở bảng điều khiển Chrome bằng phím tắt. Thật tốt khi biết phím tắt với tư cách là nhà phát triển JavaScript và React, bạn sẽ dành nhiều thời gian trên bảng điều khiển trình duyệt và đừng lười mở nó trong quá trình phát triển

________số 8_______

Học JavaScript trong 30 ngày GitHub

Sau khi bạn mở bảng điều khiển Google Chrome, hãy thử khám phá các nút được đánh dấu. Chúng tôi sẽ dành phần lớn thời gian cho Bảng điều khiển. Bảng điều khiển là nơi chứa mã JavaScript của bạn. Công cụ Google Console V8 thay đổi mã JavaScript của bạn thành mã máy. Hãy để chúng tôi viết mã JavaScript trên bảng điều khiển Google Chrome

Học JavaScript trong 30 ngày GitHub

Viết mã trên Bảng điều khiển trình duyệt

Chúng tôi có thể viết bất kỳ mã JavaScript nào trên bảng điều khiển Google hoặc bất kỳ bảng điều khiển trình duyệt nào. Tuy nhiên, đối với thử thách này, chúng tôi chỉ tập trung vào bảng điều khiển Google Chrome. Mở bàn điều khiển bằng cách sử dụng

Mac
Command+Option+I

Windows:
Ctl+Shift+I

Bảng điều khiển. đăng nhập

Để viết mã JavaScript đầu tiên của mình, chúng tôi đã sử dụng bảng điều khiển chức năng tích hợp sẵn. nhật ký(). Chúng tôi đã chuyển một đối số dưới dạng dữ liệu đầu vào và hàm hiển thị đầu ra. Chúng tôi đã chuyển 'Xin chào, Thế giới' làm dữ liệu đầu vào hoặc đối số trong bảng điều khiển. hàm log()

console.log('Hello, World!')

Bảng điều khiển. đăng nhập với nhiều đối số

Bàn điều khiển. hàm log() có thể nhận nhiều tham số được phân tách bằng dấu phẩy. Cú pháp trông giống như sau. bảng điều khiển. nhật ký (tham số1, tham số2, tham số3)

Học JavaScript trong 30 ngày GitHub

git checkout -b exercise-solutions # `-b` creates the branch if it does not exist
0

Như bạn có thể thấy từ đoạn mã trên, bảng điều khiển. log() có thể nhận nhiều đối số. Nên sử dụng càng nhiều bảng điều khiển. log() in để kiểm tra xem điều gì đang xảy ra trong mã của bạn nhưng không giữ tất cả bảng điều khiển. log() kiểm tra mã của bạn mãi mãi. Làm cho cuộc sống của bạn trở nên dễ dàng bằng cách luôn mở bảng điều khiển trình duyệt

Bình luận

Chúng tôi thêm nhận xét vào mã của chúng tôi. Nhận xét là rất quan trọng để làm cho mã dễ đọc hơn và để lại nhận xét trong mã của chúng tôi. JavaScript không thực thi phần nhận xét trong mã của chúng tôi. Trong JavaScript, bất kỳ dòng văn bản nào bắt đầu bằng // trong JavaScript đều là một nhận xét và bất kỳ dòng nào kèm theo như thế này /* */ cũng là một nhận xét

Thí dụ. Nhận xét một dòng

// Đây là bình luận đầu tiên
// Đây là bình luận thứ hai
// Tôi là một bình luận dòng đơn

Thí dụ. Nhận xét nhiều dòng

/* Đây là chú thích nhiều dòng
Nhận xét nhiều dòng có thể mất nhiều dòng
JavaScript là ngôn ngữ của web
*/

cú pháp

Ngôn ngữ lập trình tương tự như ngôn ngữ của con người. Tiếng Anh hay nhiều ngôn ngữ khác sử dụng từ, cụm từ, câu, câu ghép và nhiều ngôn ngữ khác để truyền đạt một thông điệp có ý nghĩa. Định nghĩa tiếng Anh của cú pháp là sự sắp xếp các từ và cụm từ để tạo ra các câu được hình thành tốt trong một ngôn ngữ. Định nghĩa kỹ thuật của cú pháp là cấu trúc của các câu lệnh trong ngôn ngữ máy tính. Ngôn ngữ lập trình có cú pháp. JavaScript là một ngôn ngữ lập trình và giống như các ngôn ngữ lập trình khác, nó có cú pháp riêng. Nếu chúng ta không viết một cú pháp mà JavaScript hiểu được, nó sẽ phát sinh các loại lỗi khác nhau. Chúng ta sẽ khám phá các loại lỗi JavaScript khác nhau sau. Bây giờ, chúng ta hãy xem lỗi cú pháp

Học JavaScript trong 30 ngày GitHub

tôi đã phạm một sai lầm cố ý. Do đó, bảng điều khiển phát sinh lỗi cú pháp. Trên thực tế, cú pháp rất nhiều thông tin. Nó thông báo loại sai lầm đã được thực hiện. Bằng cách đọc hướng dẫn phản hồi lỗi, chúng tôi có thể sửa cú pháp và khắc phục sự cố. Quá trình xác định và loại bỏ lỗi khỏi chương trình được gọi là gỡ lỗi. Hãy để chúng tôi sửa lỗi

git checkout -b exercise-solutions # `-b` creates the branch if it does not exist
1

Cho đến nay, chúng ta đã thấy cách hiển thị văn bản bằng bảng điều khiển. nhật ký(). Nếu chúng tôi đang in văn bản hoặc chuỗi bằng bàn điều khiển. log(), văn bản phải nằm trong dấu nháy đơn, nháy kép hoặc dấu nháy ngược. Thí dụ

git checkout -b exercise-solutions # `-b` creates the branch if it does not exist
2

số học

Bây giờ, chúng ta hãy thực hành thêm cách viết mã JavaScript bằng bảng điều khiển. log() trên bảng điều khiển google chrome cho các loại dữ liệu số. Ngoài văn bản, chúng ta cũng có thể thực hiện các phép tính toán học bằng JavaScript. Hãy làm phép tính đơn giản sau. Bàn điều khiển có thể trực tiếp lấy đối số mà không cần bàn điều khiển. hàm log(). Tuy nhiên, nó được bao gồm trong phần giới thiệu này vì hầu hết thử thách này sẽ diễn ra trong trình soạn thảo văn bản nơi việc sử dụng chức năng này là bắt buộc. Bạn có thể chơi xung quanh trực tiếp với các hướng dẫn trên bảng điều khiển

Học JavaScript trong 30 ngày GitHub

git checkout -b exercise-solutions # `-b` creates the branch if it does not exist
3

Trình chỉnh sửa mã

Chúng tôi có thể viết mã của mình trên bảng điều khiển trình duyệt, nhưng nó sẽ không hoạt động đối với các dự án lớn hơn. Trong môi trường làm việc thực tế, các nhà phát triển sử dụng các trình soạn thảo mã khác nhau để viết mã của họ. Trong thử thách JavaScript 30 ngày này, chúng tôi sẽ sử dụng Visual Studio Code

Cài đặt mã Visual Studio

Visual studio code là một trình soạn thảo văn bản mã nguồn mở rất phổ biến. Tôi khuyên bạn nên tải xuống Visual Studio Code, nhưng nếu bạn ủng hộ các trình soạn thảo khác, vui lòng làm theo những gì bạn có

Học JavaScript trong 30 ngày GitHub

Nếu bạn đã cài đặt Visual Studio Code, hãy bắt đầu sử dụng nó

Cách sử dụng mã Visual Studio

Mở Visual Studio Code bằng cách nhấp đúp vào biểu tượng của nó. Khi bạn mở nó, bạn sẽ nhận được loại giao diện này. Cố gắng tương tác với các biểu tượng được dán nhãn

Học JavaScript trong 30 ngày GitHub

Học JavaScript trong 30 ngày GitHub

Học JavaScript trong 30 ngày GitHub

Học JavaScript trong 30 ngày GitHub

Học JavaScript trong 30 ngày GitHub

Học JavaScript trong 30 ngày GitHub

Học JavaScript trong 30 ngày GitHub

Xin chúc mừng. Bạn đã hoàn thành thiết lập, bạn cần bắt đầu với React, nhưng trước khi đi sâu vào React, hãy ôn lại JavaScript. Nếu bạn cảm thấy thoải mái với JavaScript, bạn có thể bỏ qua phần ôn tập JavaScript ngày đầu tiên. Phần làm mới JavaScript rất lớn và có thể mất hơn một ngày. Theo kinh nghiệm của tôi, mọi người thường gặp khó khăn trong React vì kiến ​​thức JavaScript của họ rất nông cạn, do đó, để lấp đầy khoảng trống đó, tất cả các tính năng JavaScript cần thiết có thể được sử dụng trong React đều được đề cập trong phần ôn tập JavaScript. Có nhiều bài tập nhưng bạn không bắt buộc phải giải chúng. Nhấp vào đây nếu bạn muốn bỏ qua JavaScript và nhảy thẳng vào React

Tôi có thể học JavaScript trong 30 ngày không?

Tuy nhiên, không giống như CSS và HTML, JavaScript không phải là thứ có thể thành thạo chỉ trong hai tuần. Nhưng, có thể hoàn thành chỉ trong ba tháng . Hầu hết các nhà tuyển dụng sẽ sẵn lòng thuê bạn làm nhà phát triển web của họ nếu bạn nắm vững một số kiến ​​thức cơ bản về JavaScript. Tất nhiên, việc học không bao giờ dừng lại.

Tôi có thể học JavaScript một tháng không?

Mặc dù JavaScript là một bước tiến so với các kỹ năng phát triển web cơ bản nhất (các ngôn ngữ như HTML và CSS, có thể học trong vòng chưa đầy một tháng), nhưng bạn vẫn có thể mong đợi học những kiến ​​thức cơ bản về JS trong vài tháng chứ không phải vài năm—và đó là liệu

30 ngày JavaScript là gì?

Thử thách 30DaysOfJavaScript là hướng dẫn dành cho cả người mới bắt đầu và nhà phát triển JavaScript nâng cao . Chào mừng đến với Javascript. JavaScript là ngôn ngữ của web. Tôi thích sử dụng và dạy JavaScript và tôi hy vọng bạn cũng sẽ làm như vậy.

Tôi có thể học JavaScript trong 7 ngày không?

Thông tin cơ bản về JavaScript . Bạn có thể mất một tuần để hiểu những điều cơ bản nếu bạn là người mới bắt đầu. You will complete JS basics within 2 – 3 Days if you are busy. You might take one week to understand the basics if you are a beginner.