• Stars
    star
    172
  • Rank 221,201 (Top 5 %)
  • Language
    JavaScript
  • Created almost 5 years ago
  • Updated over 3 years ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

🔥 คอร์สฟรี! สร้าง 21 โปรเจค ใน 21 วัน ไม่ใช้เฟรมเวิร์ค ไม่ใช้ไลบรารี

Cover

🔥 คอร์สฟรี! สร้าง 21 โปรเจค ใน 21 วัน ไม่ใช้เฟรมเวิร์ค ไม่ใช้ไลบรารี สมัครเลย!

สมัครเรียน

ผู้ที่สนใจสามารถดูข้อมูลเพิ่มเติมและสมัครเรียนได้ที่ JS21.dev หลังจากสมัคร ผู้เรียนจะได้รับอีเมลที่ประกอบไปด้วย 21 วิดีโอเวิร์คช็อป และ 21 ไฟล์โปรเจค นอกจากนั้นผู้เรียนจะได้รับการเพิ่มเข้าสู่กลุ่มเฟซบุ๊ก เพื่อร่วมถาม-ตอบ ปัญหากับผู้เรียนท่านอื่น ๆ

รายละเอียดคอร์ส

ในหลายปีที่ผ่านมาภาษาจาวาสคริปต์เป็นภาษาที่ได้รับความนิยมสูงที่สุด และยังคงสูงขึ้นอย่างต่อเนื่อง ไม่ว่าจะเป็นในด้านการพัฒนาแอปพลิเคชันบนเว็บ บนเซิฟเวอร์ หรือบนมือถือ ดังนั้นความเข้าใจในภาษาจาวาสคริปต์ จึงเป็นสิ่งสำคัญมาก ที่จะทำให้ผู้เรียนสามารถสร้างแอปพลิเคชันที่มีประสิทธิภาพ

JavaScript 21 Days Challenge เป็นคอร์สแนวเวิร์คช็อปที่ออกแบบมา เพื่อให้ผู้เรียนสนุกกับการเรียนภาคปฏิบัติ ผู้เรียนจะได้ทำโปรเจคที่สามารถนำไปประยุกต์ใช้ในชีวิตจริง ในแต่ละโปรเจคจะมีการสอดแทรกความรู้เนื้อหาในภาษาจาวาสคริปต์ ไม่ว่าจะเป็น Async/Await, Event Handling, DOM Manipulation, Prototype, Context (this) เป็นต้น นอกจากนั้นผู้เรียนจะได้ทดลองใช้งานฟีเจอร์ที่กำลังจะมาในอนาคต อย่าง Speech to Text และ Text to Speech

แรงบันดาลใจ

มีเพื่อนหลายคนมาถามว่า เขาเพิ่งอ่านหนังสือจาวาสคริปต์หรือเพิ่งเรียนคอร์สออนไลน์จบ จึงอยากทำโปรเจคอะไรก็ได้ที่จะได้ลองใช้ภาษาจาวาสคริปต์กับงานจริง แต่ Tutorial ส่วนใหญ่ที่เจอ จะใช้ JQuery, React, หรือไลบรารีอื่น ๆ บาง Tutorial ใช้ภาษาจาวาสคริปต์ แต่อ่านแล้วลองทำตาม กลับไม่เข้าใจ นอกจากนั้นก็มีคนอีกกลุ่มหนึ่ง ที่เขียนภาษาจาวาสคริปต์มาได้สักระยะ แต่ส่วนใหญ่จะเป็นการเขียนโดยใช้แต่ React, Vue, Angular ซึ่งยังไม่เคยมีโอกาสที่จะลองใช้ฟีเจอร์อื่น ๆ ของภาษาจาวาสคริปต์ และยังไม่รู้ว่า Closure, Async/Await, this ทำงานอย่างไร

ผมจึงเกิดเป็นไอเดียที่อยากสร้างซีรีย์โปรเจคภาษาจาวาสคริปต์ นอกจากนั้นยังมีคนถามเข้ามาว่าทำไมต้องเป็น 21 วัน เป็น 10 วัน 15 วัน ไม่ได้หรือ จริง ๆ แล้ว 21 วันเกิดมาจากการที่ผมได้ไปอ่านบทความด้านจิตวิทยาอันหนึ่ง ซึ่งบอกไว้ว่าการทำอะไรติดต่อกันเป็นเวลา 21 วัน จะทำให้เกิดเป็นนิสัย ดังนั้นผมจึงคิดว่าถ้าเราสร้างโปรเจค เรียนรู้สิ่งใหม่ ๆ ติดต่อกันเป็นเวลา 21 วัน จะเป็นการสร้างนิสัยที่ดีในการเรียนรู้สิ่งใหม่ ๆ ต่อไป 😊

ตัวอย่างโปรเจค

Demo

ในคอร์สนี้ผู้เรียนจะได้ทำ 21 โปรเจคที่ครอบคลุมเนื้อหาในหลากหลายด้านของภาษาจาวาสคริปต์ โดยโปรเจคทั้งหมดมีดังต่อไปนี้

  1. Falling Snow
  2. Countdown Timer
  3. Async Await
  4. Eye Rolling
  5. Watercolor Painting
  6. Duck Hunt
  7. Konami Code
  8. What is "this"?
  9. Parallax Scrolling
  10. Kanban Board
  11. Text Reveal
  12. Air Quality Visualizer
  13. JavaScript Weird Parts
  14. Carousel
  15. Music Player
  16. Text to Speech
  17. Speech to Text
  18. What is "prototype"?
  19. Autocomplete
  20. Form Validation
  21. Infinite Scroll Gallery

สปอนเซอร์

JavaScript 21 Days Challenge เป็นคอร์สฟรีที่ใช้เวลาจัดทำนานหลายเดือนด้วยทุนทรัพย์ส่วนตัว เพื่อสนับสนุนวงการโปรแกรมเมอร์ไทย รวมไปถึงนักเรียน นักศึกษาที่อยากเป็นโปรแกรมเมอร์ ผู้ที่สนใจสนับสนุนสามารถช่วยแชร์คอร์ส หรือผู้ที่ต้องการสนับสนุนทุนทรัพย์สามารถติดต่อได้ที่ [email protected]

เครดิต

สร้างด้วย โดย วรายุทธ เลิศกัลยาณวัตร

More Repositories

1

relay-fullstack

☝️🏃 Modern Relay Starter Kit - Integrated with Relay, GraphQL, Express, ES6/ES7, JSX, Webpack, Babel, Material Design Lite, and PostCSS
JavaScript
986
star
2

javascript-style-guide

📕 คู่มือแนะนำสไตล์การเขียนจาวาสคริปต์ (JavaScript Style Guide)
451
star
3

github-file-icons

🍭 Chrome extension for displaying file icons on Github.
JavaScript
160
star
4

github-date-of-creation

📆 Chrome extension for displaying a date of creation of a repository hosted on Github
JavaScript
60
star
5

become-relay

🚀 Learning path to Become a Relay expert
56
star
6

Crash-Course-Series

🖖 Crash Course Series สอนตั้งแต่เริ่ม จนเขียนแอปได้
JavaScript
37
star
7

styled-components-tutorial

💅 Styled-Components in Action
JavaScript
18
star
8

Modern-React-with-Redux

JavaScript
16
star
9

Mastering-Nodejs-with-Express

JavaScript
7
star
10

Deep-Dive-into-JavaScript

Exercises used in the Deep Dive into JavaScript Workshop
JavaScript
7
star
11

hyperterm-hybrid

🖥 Hybrid theme for Hyperterm
JavaScript
6
star
12

Beginner-JavaScript

JavaScript
5
star
13

assets-crawler

🔍 Simple assets crawler that allows you to get all assets from a particular website via command-line
JavaScript
5
star
14

S5

Sensors data analysis platform for assisting elderly people
JavaScript
4
star
15

codility

JavaScript (ES6) solutions of the Codility lessons
JavaScript
4
star
16

toji

Toji - Text emoticons on your menu bar ლ(^o^ლ)
JavaScript
3
star
17

Bookstore

Java
2
star
18

pokemon

🎪 Simple Pokemon challenge game
JavaScript
2
star
19

React-Native-Fundamentals

JavaScript
2
star
20

dotfiles

Dotfiles - including vim, zsh, git, ag, tmux, and etc.
Vim Script
1
star
21

heroes

Simple Heroes application that demonstrates CRUD using Vanilla JavaScript
JavaScript
1
star
22

BookStoreMEAN

JavaScript
1
star
23

beergallery

Tutorial on building a Beer Gallery application with MEAN Stack.
CSS
1
star