ตารางอบรม (สอนผ่าน zoom) 9:00-16:00 วันละ 6 ชม.


หลักสูตร React.js (Typescript) / Node.js / Express / MongoDB

ในหลักสูตรนี้ เราจะได้เรียนเขียน Web Application ด้วย React.js (Typescript) และ Node.js ซึ่งใช้หลักการ MVC, Props+State, State Management, Secured Web APIs ที่จะช่วยทำให้การเขียน web application ง่ายต่อการวิเคราะห์, บำรุงรักษา (Maintenance)

ด้วยความสามารถของ React.js (Typescript) (frontend web library) ที่ใกล้เคียงกับ Angular Framework แต่ React.js (Typescript) เป็นเพียงแค่ Library ที่มีขนาดเล็กกว่า ทำให้โปรเจคเรามีโครงสร้างไม่ใหญ่มากและกินทรัพยากรน้อยกว่า อย่างไรก็ตาม React.js (Typescript) มีกลุ่ม 3rd-party library ที่สนับสนุนมากมาย ฉะนั้นนักพัฒนาจึงสามารถเลือกเพิ่ม Library และ ความสามารถเท่าที่จำเป็นได้ตามใจชอบ และรองรับการพัฒนาต่อยอดอย่างเป็นระบบ (Modularity) ในกรณีที่อนาคต ระบบซับซ้อนมากขึ้น ต้องรองรับผู้ใช้งานมากขึ้น

ถ้าเราเป็น React.js (Typescript) แล้ว เรายังสามารถต่อยอดไปเรียนต่อ React-Native เพื่อพัฒนา Mobile Application แบบ Cross-Platform ได้อีกด้วย และ การออกแบบเว็บแบบ SPA (Single Page App) ที่ไม่ต้อง Reload/Redirect URL บน Browser ทำให้ผู้ใช้งานรู้สึกเหมือนโหลดแอพทั้งหมดมารันทีเดียว ไม่ต้องเสียเวลาไป re-load page ใหม่ทุกครั้ง

ดาวน์โหลดเอกสารหลักสูตร (.pdf)

Course Outline

พื้นฐานผู้เข้าอบรม

  • HTML, CSS, JS พื้นฐาน
  • แนวคิด OOP C# .NET หรือ JAVA

CodeMobiles Learning Path
คลิปวีดีโอแนะนำแนวทางในการลงทะเบียนหลักสูตรโค้ดโมบายส์ สำหรับผู้ที่ไม่แน่ใจในตัวเองว่าควรลงหลักสูตรไหน
พื้นฐานผู้เข้าอบรม :
  • - HTML, CSS เบื้องต้น
  • - มีความรู้พื้นฐานเกี่ยวกับการเขียนโปรแกรมด้วยภาษาใดภาษาหนึ่ง เช่น C#, Java, JavaScript, HTML และ CSS พื้นฐาน เป็นต้น *ใช้ภาษา Typescript+JSX and JavaScript ในการสอน

เหมาะสำหรับ :
  • - ผู้ที่ต้องการพัฒนาระบบ Web Application ด้วย React.js (Typescript) + Node.JS ในรูปแบบ Responsive Website ซึ่งทำงานได้เหมือน Mobile/Win App ตอบสนองไว

สิ่งที่ต้องเตรียม :
  • 1. เครื่องโน๊ตบุ๊คที่ลงระบบปฏิบัติการ Windows 10 / Windows 8 / Windows 7 / macOS พร้อมติดตั้งโปรแกรมดังต่อไปนี้
  • 2. สมุดปากกา
  • 3. Thumb drive
  • 4. Internet

ตัวอย่าง Workshop ระบบ POS (Point of Sale)

สอนโดยทีมงานที่พัฒนาระบบ POSPOS - www.pospos.co


ภาพบรรยากาศการเรียนการสอน

เนื้อหาโดยละเอียด
    Day 1 (MERN Architecture)
    • - Introduction React.js / Node.js / Express / MongoDB
    • - Difference between Angular and React.js
    • - Setup Development Tools (Node.js + React.js packages)
    • - Using NPM (Node Package Manager)
    • - Using Yarn (Advanced Node Package Manager)
    • - Pure NodeJS+EJS vs NodeJS+React.js
    • - Basic Command lines in React.js CLI
    • - New React.js Project
    • - Review Project Structure
    • - Typescript (Javascript for React.js)
    • - JSX/TSX and Virtual-DOM (Javascript for React.js)
    • - Tool to convert HTML to JSX/TSX
    • - New and configure React(TS) project with Vite3
    • - Well React.js Project File Structure
    • - Webpack and React-Script
    • - React.js Architechture
      • React-Dom and Component
      • Component Lifecycle
      • Props
      • State
      • Data and Event Binding
      • Single Page Web Application
    • - Communication between Components (forward and backward)
    • - Forcing Re-Render
    • - Stateful and Stateless Components
    • - Functional Components
    • - React-Hook (useState, useEffect, useCallBack ..)
    • - Custom React-Hook
    • - Export and Import React.js Components
    • - Material Icons
    • - Add Google Fonts
    • - Using JQuery in React.js
    • - Typescript Programming
    • - JSX/TSX Programming
    • - React-Component-Generating Tools

    Day 2 (MaterialUI Integration + Advanced React.js)
    • - Begin reactPOS Workshop
    • - MUI (Opensource CSS Theme) Integration
    • - Flexbox - Modern CSS for Web Responsive
    • - Add Components and Assets to MaterialUI
    • - Data Exchange between Components both (Child and Parent)
    • - Callback with props between Components
    • - Routing Solution (Route, Link, Redirect, Match Page not Found) for (SPA)
    • - Sending Parameters via React-Routes
    • - Protected Routes and Authentication with React Router v4
    • - React-Redux (sharing data and actions)
    • - Redux-Toolkit to Support Asynchronous Actions
    • - Calling External Javascript in React.js
    • - Create Routing for POS and Stock Workshop
    • - Routing with Parameters
    • - Using Ref
    • - JQuery Integration
    • - Integrate DataTable and Pagination
    • - Popular Visual Studio Code Extensions such as React.js Snippet
    • - React.js Form and 2-Ways Data Binding
    • - Using React Hook-Form
    • - Logging and Debugging
    • - Redux-Logger
    • - (Optimization Search) in React
    • - (HOC) Higher Order Components
    • - Tailwind CSS

    Day 3 (Redux, Reducer, Actions, Node.js Integration)
    • - Deep Dive Node.js
    • - JSON WebAPI with Node.js with Axios
    • - Axios Interceptor (Professional HttpClient)
    • - Using Nodemon - automatically Restarting App Tool.
    • - Routing (HTTP GET, POST, DELETE and PUT) in Node.js with Express
    • - Manage Static Files (Images, CSS, Html, etc.)
    • - Learn All Response Function (Write,End,Send,JSON,SendFile,Redirect, Render)
    • - Use Express Facade Technique using app.all
    • - Error Handler such as Page not found, etc.
    • - JSON Parsing with Body-Parser
    • - Chart.js Integration
    • - Chain Routing Handlers
    • - Passing multiple parameters
    • - Regular Expression of Parameters ex: /:id, /:from-to...
    • - Using View/Template Engine (EJS/ Pug) to Manage Frontend for NodeJS without React.js
    • - Asyn Commu. with Reactive Way (Observable, Promise, Async-Await)
    • - Using Observable Operators [Of, First, timeout]
    • - React.js + Node.js Integration
    • - LocalStorage and JWT-Integration

    Day 4 (MongoDB/Mongoose/TypeORM + Node.js Integration)
    • - MongoDB Installation and Integration on Docker
    • - Learn How NoSQL and RDBMS Difference is
    • - MongoDB Concept (Document, Collection, Fields)
    • - MongoDB Command Line
    • - Install MongoDB for VS Code Extension
    • - MongoDB Using Mongoose framework to access MongoDB as Profs.
    • - TypeORM Integration
    • - Insert, Select, Update, Delete, Join (aggregate) in MongoDB
    • - Using Mongoose for Collection Schema and Default/Automation
    • - MongoDB Import and Export
    • - Connect RESTFul Webservice (JSON)
    • - Authentification as Profs.
    • - Implement Secure API with JWT (JSON Web Token)
    • - Upload file with Formiable Package

    Day 5 (Finish Workshop + Deployment + ResponsiveCSS Flexbox)
    • - Finish Workshop's Logic and Features
    • - Enable PWA (Progressive Web Application)
    • - Optimize with Lazy Load
    • - Solving CORS (Cross-Origin Resource Sharing) Issue
    • - Solving Redirection problem with Fallback
    • - Deploy in root and subfolder
    • - Production Deployment
    • - Isolating Development and Production Environment .ENV
    • - Deploy on Docker
    • - How to prevent Node.js Blocking IO
    • - Understand Event-Loop and Thread Pool
    • - Demo - Deploy on Nginx
    • - FAQ

แนะนำหลักสูตร

สุดยอดของว่างที่จะทำให้เรียนอย่างมีความสุข


More Details / รายละเอียดเพิ่มเติม

สำหรับผู้ที่ต้องการให้ทางโค้ดโมบายส์ จัดเตรียมเครื่องคอมพิวเตอร์ให้ จ่ายเพิ่ม 2,500 ฿ (ราคาไม่รวมภาษีมูลค่าเพิ่ม 7%) รบกวนแจ้งล่วงหน้า เพราะเครื่องมีจำกัด
หมายเหตุ : ทางบริษัท ฯ ขอสงวนสิทธิ์ในการเลื่อนกำหนดเปิด หรือยกเลิกคอร์ส หากมีผู้เข้าอบรมน้อยกว่าจำนวนขั้นต่ำ ซึ่งผู้อบรมที่ชำระเงินค่าอบรมแล้ว จะได้รับเงินค่าอบรมคืนทั้งหมด

Apply Now / สมัครเข้าอบรม

1.
2. e-mail มาที่ support@codemobiles.com
3. หรือโทร 081-359-9468, (Hotline 24 hrs) 081-359-9468

Payment / วิธีชำระเงิน ชำระเงินผ่านธนาคารหรือตู้ ATM
ธนาคารกสิกรไทย สาขา ซอยแฉล้มนิมิตร (ประดู่ 1)
ชื่อบัญชี บริษัท โค้ดโมบายส์ จำกัด (ออมทรัพย์) 670-2-04739-9 กรุณาตรวจสอบข้อมูลบัญชีให้ถูกต้องก่อนการโอนเงิน

*เมื่อชำระเงินเรียบร้อยแล้ว รบกวนแฟกซ์สลิปมาที่ +(66) 2-689-7926, สแกนส่งทางอีเมล support@codemobiles.com หรือโทรแจ้งมาที่เบอร์ +(66) 2-689-8943

Instructor
Chaiyasit Tayabovorn
Managing Director, CodeMobiles Co.,Ltd.

การศึกษา :
- King Mongkut's University of Technology Thonburi
- Master's Degree in Computer Engineering

- King Mongkut's Institute of Technology North Bangkok
- Bachelor's Degree in Electrical Engineering

ผลงานของผู้สอน : https://www.codemobiles.com/biz/product



รูปแบบการเรียนที่โค้ดโมบายส์



Customers / ลูกค้า

แผนที่บริษัท CodeMobiles
Contact Us

: (66)87-676-0813
: (66)2-689-8943

: support@codemobiles.com

: @codemobiles

: OnSite Training Service

: QuickSupport (วิธีใช้งาน)

: AnyDesk (วิธีใช้งาน)

: CodeMobiles Blog

: Gist-GitHub

: ShareCode

เวลาทำการ: จันทร์-ศุกร์ 9.00 - 18.00น. (ยกเว้นวันหยุดนักขัตฤกษ์)

นอกเวลาทำการฝากข้อความที่
Line: @codemobiles

สมัครเรียน









Follow Us


Our Facebook. Our Youtube Channel. Products in AppStore Products in PlayStore




Tags

iOS Dev. iOS 7,8 iOS Sqlite3 NSTableView iOS Keyboard Handler NSFileManager iOS?Optimisation Xcode Swift Programming ARC iOS Async?Image API iOS Thread iOS Admob iOS Animation iOS SSL Export iOS IPA File ASO (App Store Search Optimization) Android Dev. Androids Sqlite3 ListView Preference Android Optimisation Android ADT Android Studio Android Async?Image API Android Thread Android Admob Android In-App Billing API Android Animation Android Activity Android Service Android Content ProVider Android SSL Export Android APK File Mac Dev. VDO Training Online Training Game Dev. Android UI/UX iOS UI/UX UI/UX Google Analytic NSData, NSDictionary, NSArray Objective Class and Message iOS Database Custom TableView iOS iOS Feed iOS XML iOS JSON iOS Webservice iOS Network iOS Push Notification iOS Map Java Android XML Android JSON Android Database Custom ListView Android Android Feed Android Webservice Android Network Android Push Notification Android Map Mobile Dev. for Kids



Flag Counter

Subscribe | Contact Us | Careers | Privacy Policy
Copyright © 2010-2025 CodeMobiles Co., Ltd. All Rights Reserved.