分類・教學Tutorial

HTML

【Canvas創作教學】畫個偵測敵人的動態雷達圖網頁

本次創作直播內容透過 Canvas 物件，將網頁當作畫布，繪製不同的圖形，完成模擬偵測敵人的雷達機介面；運用三角函數概念，以及模組化程式，簡單製作出動態的網頁，詳細的步驟解釋，無論有沒有基礎，都能輕鬆跟著說明完成，剩下的就由你自行發揮囉！

你多久沒鍛鍊英文了呢？這次直播使用HTML(Pug)CSS(Sass)以及Javascript(Vue.js)來完成一個練習2000字英文單字的小互動遊戲網頁，難度適中，尤其適合剛開始學習Vue.js的新手，無論是跟著步驟逐步操作，或是聽老闆的影片都能快速完成。

手機裡的動態月曆．只消一指就可以增加或是刪除行程，有想過要怎麼在網頁上實現嗎？老闆利用簡單的動態網頁範例和步驟解說，帶你一步步踏進Vue.js的世界。

小時候都玩過圈圈叉叉的遊戲，隨手畫個井字就可以與玩伴鬥智，這次我們要利用Pug、Sass及Vue.js製作出這款動態小遊戲網頁啦！

不論個人或是品牌，都需要讓網站造訪者快速暸解你的歷史發展，時間軸年表是一個常見且好用的表示方法。利用Pug(HTML)、Sass(CSS)及Vue.js製作出一個屬於你的動態時間軸年表吧！

需要發想靈感、紀錄個人代辦清單，或和他人討論嗎？製作一個能夠自由編輯、增刪、變色、拖曳編排的便利貼牆網頁，多個願望一次滿足。上集我們使用Pug、Sass及Vue.js刻出便利貼的基本功能。