Arduino 自造趣:結合 JavaScript x Vue x Phaser 輕鬆打造個人遊戲機 (iThome鐵人賽系列書)
林昰辰
- 出版商: 博碩 iThome鐵人賽系列書|任選2書75折
- 出版日期: 2022-12-06
- 定價: $690
- 售價: 7.8 折 $538
- 語言: 繁體中文
- 頁數: 384
- ISBN: 6263333138
- ISBN-13: 9786263333130
-
相關分類:
Arduino、Vue.js、遊戲設計 Game-design
立即出貨(限量) (庫存=4)
買這商品的人也買了...
-
MIS 網管達人的工具箱, 3/e$560$436 -
資安專家的 nmap 與 NSE 網路診斷與掃描技巧大公開$450$382 -
超圖解 Python 物聯網實作入門 -- 使用 ESP8266 與 MicroPython$699$594 -
Kaggle 競賽攻頂秘笈 -- 揭開 Grandmaster 的特徵工程心法,掌握制勝的關鍵技術$1,000$850 -
人工智慧大現場 - 實用篇-35天從入門到完成專案$690$538 -
超簡單 AIoT 物聯網與網站架設必學神器:Node-RED 視覺化開發工具$650$507 -
Raspberry Pi 樹莓派:Python x AI 超應用聖經$699$594 -
OCP:Java SE 11 Developer 認證指南 (上) -- 物件導向設計篇$690$538 -
OCP:Java SE 11 Developer 認證指南 (下) -- API 剖析運用篇$820$639 -
今晚來點 Web 前端效能優化大補帖:一次搞定指標 × 工具 × 技巧,打造超高速網站(iThome鐵人賽系列書)$650$507 -
你就是不寫測試才會沒時間:Kuma 的單元測試實戰 -- Java篇(iThome鐵人賽系列書)$650$507 -
Object-Oriented Python|以 GUI 和遊戲程式學物件導向程式設計 (Object-Oriented Python)$520$410 -
高速建立大型桌面應用 - 全新 Electron 框架現在就動手做$880$695 -
不可不知的 Docker 開發部署實戰筆記:網站工程師一定要會的 8大核心能力$620$483 -
社群經營一定要會的影音剪輯與動畫製作術 (附範例素材/範本/Canva手機版示範影音教學)$420$331 -
超簡單 Python / MicroPython 物聯網應用:堆積木寫程式輕鬆學習軟硬體整合, 2/e$720$561 -
和艦長一起 30 天玩轉 GitLab【第二版】(iT邦幫忙鐵人賽系列書)$650$507 -
前進元宇宙!區塊鏈輕旅行:每天5分鐘,學會比特幣×以太坊×NFT概念及應用(iThome鐵人賽系列書)$600$468 -
量子技術:驅動計算、人工智慧、通訊、測量的未來革命$450$351 -
科學方法賺大錢 - Python 進行商品期貨量化交易$720$568 -
智慧門市管理|收銀大師 2 流通管理資訊系統$390$308 -
OAuth 2.0 從入門到實戰:利用驗證和授權守護 API 的安全$600$468 -
物聯網高手的自我修練:帶你玩轉樹莓派、Arduino 與 ESP32$750$585 -
AI 時代 Math 元年 - 用 Python 全精通數學要素$980$774 -
甚麼?網頁也可以做派對遊戲?使用 Vue 和 babylon.js 打造 3D 派對遊戲吧!$980$774
iThome鐵人賽系列書|任選2書75折 詳見活動內容 »
-
78折
LINE Bot Side Project 實戰 : 從設計思考到部署與產品變現的 16堂關鍵必修課(iThome鐵人賽系列書)$660$514 -
78折
專案管理胃痛圖鑑:從臨床診斷到重症急救,31 帖 PM 生存處方藥到病除!(iThome鐵人賽系列書)$680$530 -
78折
Claude 工作術:從 Chat、Projects、Skills 到 Cowork 與 Claude Code 的 AI 自動化之路(iThome鐵人賽系列書)$690$538 -
78折
Unity × 設計 × 互動邏輯的遊戲開發全攻略:不會寫程式也能做遊戲,從零開始完成你的第一款 3D遊戲(iThome鐵人賽系列書)$660$514 -
78折
範例驅動的需求澄清術:如何用精準範例指揮 GenAI 建構高品質軟體(iThome鐵人賽系列書)$680$530 -
78折
作業系統的專武:DevSecOps 在客戶端、廠商端與資安的實戰維運攻略(iThome鐵人賽系列書)$620$483 -
78折
Node.js 生成式 AI 應用開發實戰:實作 OpenAI API × LangChain × LangGraph × RAG,打造從雲端到本地 LLM 的混合式安全架構(iThome鐵人賽系列書)$680$530 -
78折
Vibe Unity | AI 遊戲開發工作流:打破極限,創造一款具有無限可能性的遊戲!(iThome鐵人賽系列書)$680$530 -
78折
一生受用的求職方法:量化求職—海外求職、頂尖外商與遠距求職必備攻略(iThome鐵人賽系列書)$690$538 -
78折
零基礎玩轉 LLM 應用全攻略:Python × No-Code 實作 AI 開發超簡單(iThome鐵人賽系列書)$690$538 -
78折
我阿嬤都比你會測試:從生活智慧建立測試思維,到自動化與 AI 的完整進化(iThome鐵人賽系列書)$620$483 -
78折
UI 自動化測試與 AI 應用實戰:實作 Robot Framework × Playwright × Appium 從 Web、App 到 CI/CD 流程整合全方位攻略(iThome鐵人賽系列書)$650$507 -
78折
AI 時代的 Side Project 全攻略:產品思維 × 專案管理 × 變現路徑(iThome鐵人賽系列書)$690$538 -
78折
程式人的第一本 Python 量化投資筆記:Colab 即時演練 × Backtrader 策略設計到績效評估全流程(iThome鐵人賽系列書)$600$468 -
78折
今晚來點 Web 前端效能優化大補帖:從效能優化掌握前端開發的底層邏輯 全彩版(iThome鐵人賽系列書)$720$561 -
78折
Grafana Zero to Hero:從視覺化到智慧監控,打造全知視角的可觀測性平台(iThome鐵人賽系列書)$720$561 -
78折
猴子也能懂的電腦對局:從入門到實戰帶你打造遊戲 AI(iThome鐵人賽系列書)$650$507 -
78折
AI 最強調整術:使用最佳化演算法,打造頂級機器學習模型 (iThome鐵人賽系列書)$650$507 -
78折
為你寫的 Vue Components:從原子到系統,一步步用設計思維打造面面俱到的元件實戰力 (iThome鐵人賽系列書)$780$608 -
78折
AI 程式設計、深度學習與 LLM 入門到精通:PyTorch × GPT × Transformer × LLaMA 實作指南(iThome鐵人賽系列書)$650$507 -
78折
30天整頓職場!從徵才陷阱到離職黑箱,應對話術 × 舉證對策 × 職場防線一書掌握(iThome鐵人賽系列書)$600$468 -
78折
LangGraph 實戰開發 AI Agent 全攻略:掌握 AI 模型 × 工作流程 × 設計應用,從零打造智慧分工多代理協作系統(iThome鐵人賽系列書)$660$514 -
78折
Browser Web API 攻略大全:從開箱即用的實作範例開始,逐步掌握開發技巧(iThome鐵人賽系列書)$650$507 -
78折
想要 SSR? 快使用 Nuxt 吧!:Nuxt 讓 Vue.js 更好處理 SEO 搜尋引擎最佳化(iThome鐵人賽系列書)$780$608 -
78折
RAG × LangChain 整合應用:從問診機器人開始,打造可信任的 AI 系統 (iThome鐵人賽系列書)$600$468
商品描述
原來網頁還可以這樣玩?融合電子電路與網頁,一起打造有趣的遊戲吧!
【內容簡介】
本書內容改編自【第13屆】2021 iThome 鐵人賽,Modern Web 組佳作網路系列文章 ──《你渴望連結嗎?將 Web 與硬體連上線吧!》。
隨著瀏覽器支援的 Web API 越來越豐富,有一天我注意到了「Web Serial API」這個神奇的東東。以往 JS 沒有權限能夠存取作業系統底層 API,所以要進行串列通訊都需要一個中介伺服器轉送資料,但是透過 Web Serial API 就可以直接透過瀏覽器進行串列通訊了!於是這個主題就這麼誕生了。
【寓教於樂】
本書應用情境將以各類遊戲為主,了解電子訊號如何與遊戲結合。透過遊戲與技術的連結,讓讀者能夠從底層了解運作原理且不會枯燥乏味。
【由淺入深】
本書將依序介紹 Vue、Quasar、Firmata、各類電路等等技術,讓讀者可以循序漸進的認識相關技術,並整合這些技術、設計情境,透過一層一層堆疊,最終淬鍊出一個完整的應用程式。
【設計與分析】
軟體開發領域的工程師一定都知道一個永遠不變的道理,就是「技術會不斷更新」。
本書在設計應用情境章節時,會先從需求分析、設計草稿開始,因為技術會變,但是設計與分析的過程基本上大同小異,學會「如何分析、解決問題等等技能」遠比「學會使用工具或某項技術」還重要。
作者簡介
林昰辰
機械、自動控制領域出身,在 IoT 概念普及後,一頭栽進前後端開發,熱衷於結合各類領域技術、開發酷酷的東西。
GitLab:
https://gitlab.com/pony2140
Youtube:
https://www.youtube.com/user/pony2140/playlists
LinkedIn:
https://www.linkedin.com/in/shih-chen-lin-codfish
目錄大綱
Chapter 01 萬事起頭難
1.1 電壓與電流
1.2 微控制器
1.3 Firmata
1.4 串列通訊(Serial communication)
1.5 Web Serial API
1.6 前端框架
Chapter 02 Hello Firmata
2.1 集結硬體小夥伴
2.2 燒入Firmata 韌體
2.3 一起看懂通訊協定
Chapter 03 建立前端地基
3.1 TypeScript 簡介
3.2 TypeScript 入門
3.2.1 基礎型別
3.2.2 介面
3.2.3 函數
3.3 介紹開發工具與套件
3.3.1 Visual Studio Code
3.3.2 Vue
3.3.3 Pinia
3.3.4 Quasar
3.3.5 Tailwind CSS
3.3.6 Lodash
3.3.7 Day.js
3.3.8 Vite
3.4 建立專案
Chapter 04 Web Serial API 初體驗
4.1 建立 Port 設定對話框
4.2 建立資料收發模組
4.3 建立 Firmata 功能
4.4 儲存並顯示 Firmata 資料
4.5 今晚,我想來點「腳位清單」加「功能模式」,配「類比映射表」
4.5.1 取得腳位與功能
4.5.2 取得類比腳位映射表
Chapter 05 打開第一扇窗
5.1 建立 base-window 元件
5.2 建立範例視窗
5.3 自動調整堆疊順序
5.4 關閉視窗
Chapter 06 數位×IN×OUT
6.1 何謂數位訊號
6.2 建立 Firmata 轉換工具
6.3 建立數位 I/O 視窗
6.4 建立腳位選擇器
6.5 數位訊號
6.5.1 數位輸入(Digital Input)
6.5.2 數位輸出(Digital Output)
6.5.3 上拉輸入(Input Pullup)
6.6 硬體實作
6.6.1 準備零件
6.6.2 檢查硬體
6.6.3 連接電路
6.6.4 補充說明
6.7 建立數位控制元件
6.7.1 數位輸出
6.7.2 數位輸入
Chapter 07 類比× 電壓× 輸入
7.1 何謂類比訊號
7.2 建立類比輸入視窗
7.3 加入視窗內容
7.4 類比輸入(Analog Input)
7.5 硬體實作
7.5.1 準備零件
7.5.2 檢查硬體
7.5.3 連接電路
7.6 建立類比輸入控制元件
Chapter 08 來互相傷害啊!
8.1 認識 Phaser
8.1.1 Game
8.1.2 Scene
8.1.3 Sprite
8.1.4 Animations
8.2 規劃遊戲:貓狗大戰
8.2.1 歡迎場景
8.2.2 主場景
8.2.3 結束場景
8.3 建立視窗
8.4 認識搖桿
8.5 建立設定欄位
8.6 處理搖桿訊號
8.6.1 建立按鈕物件
8.6.2 建立搖桿物件
8.7 打造遊戲!
8.7.1 載入素材
8.7.2 歡迎來到貓狗大戰
8.7.3 遊戲開打
8.7.4 遊戲結束
















