ตัวอย่างการใช้งาน

เรียนรู้จาก
ตัวอย่างจริง

สำรวจตัวอย่างการใช้งาน Now.js Framework ที่หลากหลาย
จากพื้นฐานไปจนถึงขั้นสูง พร้อม Source Code ให้ศึกษา

UI Components ฟอร์ม & Input แสดงข้อมูล Interactive Navigation แอปพลิเคชัน

UI Components
ส่วนประกอบพื้นฐาน

ส่วนประกอบ UI ที่จำเป็นสำหรับสร้างแอปพลิเคชันสมัยใหม่

Essential

Button Gallery

รูปแบบปุ่มครบถ้วน ทั้ง primary, outline, gradient, social media และ button groups

Buttons Styling
ดูตัวอย่าง Github
Popular

Modal Component

โมดอลแบบ dynamic, data binding, gallery mode และใช้งานโดยไม่ต้องเขียน JavaScript

Modal Dialog Lightbox
ดูตัวอย่าง Github
Popular

Media Viewer

แสดงรูปภาพและวิดีโอแบบ Lightbox พร้อมภาพย่อ สไลด์โชว์อัตโนมัติ YouTube ซูม/เลื่อนภาพ และสร้างแกลเลอรีด้วย Data Attributes

Lightbox Gallery Video
ดูตัวอย่าง Github
Essential

DialogManager

ระบบจัดการ Dialog ทรงพลัง รองรับ Alert, Confirm, Prompt และ Custom Dialog พร้อม Draggable

Dialog Alert Prompt Draggable
ดูตัวอย่าง Github
Essential

Tabs Component

แท็บแนวนอนและแนวตั้ง พร้อมการนำทางด้วยคีย์บอร์ดและ ARIA accessibility

Tabs Navigation Accessibility
ดูตัวอย่าง Github
Essential

Notification Manager

Toast notifications พร้อม auto-dismiss, progress bar, smart replacement และควบคุมตำแหน่ง

Toast Alert Notification
ดูตัวอย่าง Github
Reference

Typography

รูปแบบตัวอักษรครบถ้วน ทั้งหัวข้อ, สี, พื้นหลัง และ inline text elements

Typography Colors Styling
ดูตัวอย่าง Github
Essential

Application Configuration Manager

ระบบจัดการธีม Light/Dark mode พร้อม API config, CSS variables และ smooth transitions

Theme Dark Mode CSS Variables
ดูตัวอย่าง Github

ฟอร์ม & Input
ส่วนประกอบการกรอกข้อมูล

ส่วนประกอบฟอร์มที่ทรงพลัง พร้อม validation, autocomplete และการจัดการ input ขั้นสูง

Essential

Form Validation

ฟอร์มพร้อม validation แสดงการใช้งาน Form Manager และ Validation Rules

Form Validation
ดูตัวอย่าง Github
Popular

File Upload

อัปโหลดไฟล์ครบครัน พร้อม preview, drag & drop, sorting และ validation

Upload Drag & Drop Preview
ดูตัวอย่าง Github
Interactive

Multi Select

Dropdown เลือกหลายรายการ พร้อมการนำทางด้วยคีย์บอร์ดและรองรับฟอร์ม

Select Multiple Dropdown
ดูตัวอย่าง Github
Advanced

Cascading Select

Dropdown แบบเชื่อมต่อ (จังหวัด → อำเภอ → ตำบล) พร้อมโหลดข้อมูลจาก API

Cascade Dependent Address
ดูตัวอย่าง Github
Advanced

Hierarchical Address

Autocomplete ที่อยู่ไทย พร้อมค้นหาย้อนกลับได้ทุกระดับลำดับชั้น

Autocomplete Hierarchy Address
ดูตัวอย่าง Github
Comprehensive

Text Elements

Input แบบต่างๆ ทั้ง email, URL, mask input, tags input และ autocomplete

Input Mask Tags Autocomplete
ดูตัวอย่าง Github
Business

Line Items

ตารางรายการสินค้าที่แก้ไขได้ สำหรับใบสั่งซื้อ ใบแจ้งหนี้ที่มี VAT และส่วนลด และใบรับสินค้าที่ดึงข้อมูลจากใบสั่งซื้อ

Invoice Purchase Order VAT
ดูตัวอย่าง Github

แสดงข้อมูล
Visualize Your Data

ส่วนประกอบสำหรับแสดงและจัดการข้อมูลอย่างมีประสิทธิภาพ

Popular

Data Table

ตารางข้อมูล แสดงการใช้งาน sorting, filtering, pagination และ CRUD

Table Sorting Pagination
ดูตัวอย่าง Github
Advanced UI

Calendar App

ปฏิทิน พร้อมการจัดการ event และนำทางวันที่

Calendar Events Date
ดูตัวอย่าง Github
Interactive

Sortable List

ลากวางเรียงลำดับ พร้อม kanban board, priority list และรองรับข้ามคอนเทนเนอร์

Drag & Drop Sortable Kanban
ดูตัวอย่าง Github
Popular

Graph Component

กราฟ SVG ทั้ง line, bar, pie, donut และ gauge รองรับข้อมูลจากตารางหรือ API พร้อม auto refresh และ export

Charts SVG Data Viz
ดูตัวอย่าง Github

ตัวอย่าง Interactive
เรียนรู้พื้นฐาน

ตัวอย่าง interactive อย่างง่าย เพื่อทำความเข้าใจหลักการพื้นฐาน

Beginner

Counter App

แอปนับเลขอย่างง่าย แสดงการจัดการ State และ Event Handling

State Events
ดูตัวอย่าง Github
Popular

Todo List

รายการสิ่งที่ต้องทำ แสดงการใช้งาน List Rendering, Data Binding และ Local Storage

CRUD List Storage
ดูตัวอย่าง Github
Interactive

Edit-in-Place

แก้ไขข้อความแบบ inline โดยไม่ต้องเปิดฟอร์มหรือ modal พร้อม validation และ AJAX

Inline Edit Validation AJAX
ดูตัวอย่าง Github
Practical

API Integration

ดึงข้อมูลจาก API แสดงการใช้งาน HTTP Client และ Loading States

API Fetch Async
ดูตัวอย่าง Github

แอปพลิเคชันเต็มรูปแบบ
ตัวอย่างจริง

ตัวอย่างแอปพลิเคชันครบถ้วน แสดงฟีเจอร์ทั้งหมดของ framework

Featured

Admin Dashboard

แดชบอร์ดผู้ดูแลระบบ พร้อม charts, data tables และ UI components ต่างๆ

Dashboard Charts Admin
ดูตัวอย่าง Github
Enterprise

CRM System

ระบบจัดการลูกค้าสัมพันธ์ พร้อม kanban board, forms และ data visualization

CRM Kanban Business
ดูตัวอย่าง Github
Complete

School CMS

เว็บไซต์โรงเรียนครบถ้วน พร้อมข่าวสาร, gallery, contact form และ API integration

CMS Website API
ดูตัวอย่าง Github
E-commerce

Coffee Shop

แอป E-commerce พร้อม product catalog, ตะกร้าสินค้า และ checkout flow

E-commerce Cart Checkout
ดูตัวอย่าง Github
Reactive

Social Media App

ฟีดโซเชียลมีเดีย พร้อม infinite scroll, โพสต์พร้อมอัปโหลดรูปและพรีวิว และกดถูกใจ/บุ๊กมาร์กแล้วอัปเดตทันที

Social Feed Infinite Scroll
ดูตัวอย่าง Github
Integration

XLSX Browser

เปิดดูไฟล์ .xlsx แบบ Tree View และตาราง อ่านไฟล์ฝั่งเซิร์ฟเวอร์ด้วย PHP และส่งออกเป็น CSV หรือ JSON

PHP + JS File Viewer AppConfigManager
ดูตัวอย่าง Github

พร้อมสร้างแอปของคุณเองแล้วหรือยัง?

ดาวน์โหลด Now.js และเริ่มสร้างแอปพลิเคชันที่น่าทึ่ง
ด้วยตัวอย่างและเอกสารที่ครบถ้วน

ดาวน์โหลดเลย ดูเอกสาร