Loading...
All Posts In Category

技術筆記

技術筆記

DOM 和 Virtual DOM 是什麼?認識 Document Object Model

DOM (Document Object Model)是瀏覽器所產生出來的資料結構,一方面表現出 HTML 的內容與架構,另一方面讓開發者有機會使用 JavaScript 透過 DOM 來操作頁面。

Posted on 
Nov 21, 2020
  by
TD
Read More
技術筆記

如何 Debug ?從認識 Chrome DevTools 學習前端優化 Debug 技巧

內容主要圍繞在前端相關的 Debug 偵錯技巧,只要你有網頁開發經驗,尤其: 每天都會開啟瀏覽器的 Devtools,常常需要刻 UI,以及撰寫許多 HTML、CSS ,以 JavaScript 維生,需要進行前端效能、SEO 優化。都非常推薦閱讀

Posted on 
Nov 5, 2020
  by
shizuku
Read More
技術筆記

Leetcode是什麼?誰需要刷題?工程師面試要刷到什麼程度

當好的工程師職缺出現在求職市場時,眾多求職者將湧入其中爭取面試機會,企業使用履歷進行篩選之外,會考驗應徵者的基本開發能力以及專案經歷。前者常見的測試方式為白板題與線上題庫測驗;後者則看求職者的作品集來了解。而 LeetCode 便是常見了解題目的手段,其記錄各式各樣的題目好讓求職者有個底。

Posted on 
Nov 5, 2020
  by
Victor
Read More
技術筆記

MVC架構是什麼?認識 Model-View-Controller 軟體設計模式

當我們把關注點分離的概念落實到軟體架構 (architectural pattern) 時,最常見的分工是把「管理資料的功能」和「呈現視覺的功能」分離。很常用的設計模式叫作 MVC 設計模式,在這個架構裡,會把軟體分成 Model、View、Controller 三大功能層。每一次 request/response 週期的背後,都由這三大功能層來合作完成

Posted on 
Sep 2, 2020
  by
ALPHA Camp
Read More
技術筆記

認識軟體佈署與 PaaS 雲端服務 Heroku

佈署 (Deploy)通常代表了一系列動作,包含在線上環境中架設主機、安裝環境、上傳並啟動專案。這篇介紹硬體軟體兼具的 PaaS(Platform as a Service,平台即服務)雲端服務 Heroku,我們只要把寫好的專案「推」到平台上,網站就能開始運作了

Posted on 
Aug 28, 2020
  by
ALPHA Camp
Read More
技術筆記

Webpack 新手入門:模組打包工具的用途及 Webpack 工作方式的基本觀念

Webpack 是什麼?Webpack 是一個「模組打包工具」(module bundler)。你可能又會接著問,那什麼是模組?什麼是打包?這篇文章我們會由淺入深地理解這些問題,並了解 Webpack 的用途及它的基本觀念。

Posted on 
Jul 27, 2020
  by
Dez
Read More
技術筆記

Postman 新手教學|使用Postman 開發出你的第一支 API

Postman 是測試 API 必備神器,本篇是給Postman新手入門使用,讓你在10分鐘快速上手基本 Postman用法,從基本GET API ,到需要驗證的 POST API,包含基本觀念像是請求四大方法CRUD(Create/Read/Update/Delete),Header 參數簡介,並使用Postman上傳/下載檔案

Posted on 
Jul 13, 2020
  by
Water
Read More
技術筆記

MySQL 基本運作介紹,從資料庫交易與 ACID 特性開始

這篇文章將介紹 MySQL 的基本運作,MySQL 是如何處理來自使用者或應用程式的請求、如何處理資料修改、不同的 isolation,以及他們與資料庫 ACID (Atomicity, Consistency, Isolation, Durability) 特性之間的關係。不懂 SQL 語法也是完全沒有問題。

Posted on 
Jul 6, 2020
  by
TD
Read More
技術筆記

什麼是 Ajax? 搞懂非同步請求 (Asynchronous request)概念

Ajax 是 Asynchronous JavaScript and XML 的縮寫,這篇帶你了解Ajax是什麼,幫助你釐清非同步請求的概念,同時看完後能學會使用 axios 向第三方請求資料。

Posted on 
Jun 29, 2020
  by
ALPHA Camp
Read More
技術筆記

什麼是REST? 認識 RESTful API 路由語義化設計風格

REST 是 Representational State Transfer 的縮寫。REST 是一種軟體架構風格(並非標準),目的是幫助在世界各地不同軟體、程式在網際網路中能夠互相傳遞訊息。運用 HTTP 來表達語義的路由設計風格稱為 RESTful API。

Posted on 
Jun 15, 2020
  by
ALPHA Camp
Read More
技術筆記

Wireframe是什麼?認識網站UI設計排版草圖與資訊架構

Wireframe (線框稿)主要目的是溝通網頁的架構、內容、功能、行為、資訊階層,會用非常簡單的灰階顏色、線條、符號或框線,來表達網頁的排版架構。本文帶你學習以 wireframe 這個 UI/UX 呈現方式,研究如何透過 wireframe,傳達各種不同的使用者介面UI與體驗組件,比如資訊架構和排版。

Posted on 
Jun 8, 2020
  by
ALPHA Camp
Read More
技術筆記

認識演算法(Algorithm)與運算思維(Computational Thinking)

演算法 (Algorithm)是一系列有條理的步驟,能用於計算、解決問題、做出決定。 運算思維(Computational Thinking)是一個思考的程序。它的目的是闡明問題,並呈現其解決方案,因而讓「運算器」(包括機器與人) 能夠有效率地執行。這篇文章就用實際的範例,帶你了解演算法和運算思維是什麼?以及學習他們的重要性。

Posted on 
Jun 1, 2020
  by
ALPHA Camp
Read More
技術筆記

Docker 是什麼?實戰手札帶你認識 Docker

Docker是一個開源專案,讓你能快速建立、測試、部署應用程式的軟體平台。這篇文章帶你基礎認識Docker是什麼,以及實戰下載Docker Hub image 並執行容器。

Posted on 
May 26, 2020
  by
EugeneChen
Read More
技術筆記

HTML 語法教學,快速攻略網頁 HTML 標籤的基本元素

HTML 是 Hypertext Markup Language 的縮寫,也就是「超文本標記語言」(請注意他是標記語言,不是程式語言)。HTML5是HTML的最新修訂版本,本文帶你了解HTML是什麼,以及快速攻略 HTML標籤。

Posted on 
May 22, 2020
  by
ALPHA Camp
Read More
技術筆記

該用 MySQL 或 MongoDB?選擇資料庫前你該了解的事

學習資料庫時,MySQL 與 MongoDB 是我們常會先碰到的資料庫 。「該用 MySQL,還是用 MongoDB 好呢?」兩者的背後,分別代表著不同的資料庫設計方式,各有各自的優缺點,用來解決不同的問題。這篇文章帶你了解RDBMS和NoSQL的差異,釐清挑選最適合的資料庫,你該了解的事,來幫助你完成任務。

Posted on 
May 4, 2020
  by
TD
Read More
技術筆記

API是什麼?認識 Web API、HTTP 和 JSON 資料交換格式

API 是 Application Programming Interface 的縮寫,API中文是「應用程式介面」。這篇帶你認識 Web API 和 HTTP 的關係,從客戶端和伺服器端來瞭解網路 API 的角色。以及在使用 Web API 交換資料時,常見的 JSON 資料交換格式。

Posted on 
Apr 24, 2020
  by
ALPHA Camp
Read More
技術筆記

CSS 教學語法入門:認識階層樣式表與 Box model 介紹

CSS 語言是專為定義網頁的版面設計(layout)而發明的,你可以透過它指定文件中各項 HTML 元件的視覺樣式。CSS 的全名是 Cascading Style Sheets,階層樣式表。而所謂的「階層式 (cascading)」,指的是我們可以在同一個元件上套用不同樣式,樣式與樣式之間則存在相對的階層關係。

Posted on 
Apr 23, 2020
  by
ALPHA Camp
Read More
技術筆記

網路應用程式是什麼?Web App與Native App的差別

應用程式是原文是 application,也簡稱 App。「應用程式」因為明確的任務而存在,讓終端使用者可以執行特定任務的軟體。能夠直接在網路上執行的軟體被稱為「網路應用程式」(Web application, web apps)。有些應用程式在「本地」(locally) 執行,也就是說它們會安裝到你的電腦上,這種稱為原生應用程式 (native applications, native apps)。

Posted on 
Apr 14, 2020
  by
ALPHA Camp
Read More
技術筆記

Stack Overflow 教學:給工程師初心者的問答指南

Stack Overflow 是一個程式設計領域最熱門的工程師技術問答論壇網站。無論程式新手還是老手,都可在論壇內提出和回答問題,進而獲得一些在 Stack Overflow 上的聲望值。工程師遇到程式問題,也常依賴Stack Overflow找答案。這篇文章給入門者介紹Stack Overflow,並提供如何使用這個工程師社區的基本指南。

Posted on 
Mar 30, 2020
  by
Andy Lien
Read More
技術筆記

什麼是 jQuery?前端框架盛行還需要JavaScript函式庫嗎?

jQuery是一個簡化瀏覽器 API 的JavaScript函式庫。jQuery之所以受歡迎,是因為他提供了一系列簡單方便,而且兼容的操作,省去開發人員的部份煩惱。本篇帶你看jQuery前世今生,了解jQuery到底是什麼、以及他在網頁技術演進的地位、影響與未來。

Posted on 
Mar 25, 2020
  by
lagagain
Read More
技術筆記

SQL/NoSQL是什麼?認識資料庫管理系統DBMS

SQL (Structured Query Language 結構化查詢語言) 是一種專門用來管理與查詢關聯式資料庫RDBMS的程式語言。NoSQL資料庫的意思是 "Not Only SQL",也就是不限定為「關聯式資料庫」的資料庫管理系統的統稱。在這篇文章,會入門介紹「關聯式資料庫」與「NoSQL資料庫」這兩種常見的資料庫管理系統(database management system,簡稱 DBMS)。

Posted on 
Mar 9, 2020
  by
ALPHA Camp
Read More
技術筆記

Bootstrap 是什麼?給網頁設計新手的 Bootstrap 4入門教學

Bootstrap 是一個由 HTML、CSS 和 JavaScript 寫成的前端框架,核心的設計目標是達成RWD響應式與行動優先,也就是讓你的網站排版可以自動適應螢幕大小。它預先做好一套網站的基礎建設,讓你能在框架的基礎上進行開發,不需要再去煩惱瑣碎的設定。本篇介紹怎麼把 Bootstrap 4框架整合到你的網站裡,並介紹使用 Bootstrap 的官方文件。

Posted on 
Mar 2, 2020
  by
ALPHA Camp
Read More
技術筆記

Git與GitHub介紹,軟體版本控制基本教學

Git 和 GitHub 是什麼?軟體開發常聽到的這兩個名詞有什麼關係?這篇Git和GitHub教學,將介紹工程師必備技能「版本控制系統」Git,還有以 Git 為核心技術基礎的「雲端版本控制服務平台」GitHub 該如何使用。認識軟體工程師的在軟體開發流程的頭號課題:如何管理程式碼。

Posted on 
Feb 25, 2020
  by
ALPHA Camp
Read More
技術筆記

Chrome Extension 實戰經驗分享,從發想、實作、上架到萬人下載

如何製作 Chrome 擴充功能外掛?ALPHA Camp 全端開發課程的學生番茄湯,分享他如何發想、製作、到上架他的 Chrome Extension「Find Sci paper」,還成功獲得了超過萬人下載的佳績。

Posted on 
Feb 18, 2020
  by
TomatoSoup
Read More
技術筆記

VSCode快速安裝教學,推薦常用外掛擴充套件

‍Visual Studio Code (簡稱VSCode)是一個支援多平台的開放原始碼免費程式碼編輯器,在2019 Stackoverflow的調查中,也是Web開發者最熱門的程式編輯器。這篇基本的VSCode安裝使用教學,帶你快速上手設定本地開發環境,並推薦常用的VSCode外掛套件(Extensions)。

Posted on 
Feb 7, 2020
  by
ALPHA Camp
Read More
技術筆記

Sass/SCSS 基本語法介紹,搞懂CSS 預處理器

現今較為主流的 CSS 預處理器有三種,分別是 Sass/SCSS、Less、Stylus,其中的 Sass/SCSS 是目前最多人使用也相對較成熟的選擇。CSS preprocessor(CSS 預處理器)可以說是 CSS 語法的擴充,CSS 預處理器中新增了變數、混入、繼承、嵌套等寫法,讓開發者可以更有結構地撰寫簡潔、清晰且好維護的 CSS 程式碼。

Posted on 
Nov 13, 2019
  by
Dez
Read More
技術筆記

LINE chatbot 聊天機器人怎麼做?帶你詳細步驟上手

Line chatbot 開發該如何開始?這篇文章詳細實作步驟指南,帶你做出自己的第一個Line聊天機器人。

Posted on 
Oct 24, 2019
  by
振銜
Read More
技術筆記

Node.js 是什麼?跟 JavaScript 有什麼關係

Node.js 是一個能執行 JavaScript 的環境,以Google Chrome V8 引擎為核心,加上一系列 C/C++ 的套件,讓 Server 端也可以執行 JavaScript。這篇文章從最基本的介紹出發,並提到 Node.js 的語言特性在高併發情況的優勢,最後重點理解 JavaScript 的重要特色:事件迴圈,背後是如何在伺服器端執行。

Posted on 
Oct 18, 2019
  by
Gary
Read More
技術筆記

一文搞懂 HTTP 和 HTTPS 是什麼?兩者有什麼差別

HTTPS 全名 超文本傳輸安全協定,那個 S 就是 Secure 的意思;HTTPS 透過 HTTP 進行通訊,但通訊過程使用 SSL/TLS 進行加密,藉由類似於前述的加密方式,在 HTTP 之上定義了相對安全的資料傳輸方法。

Posted on 
Oct 14, 2019
  by
Gary
Read More
技術筆記

NPM是什麼?了解Node Package Manager套件管理機制

npm 即為 Node Package Manager 的縮寫,開發者可以透過 Node 隨附的 npm cli,進行套件的安裝及管理。

Posted on 
Oct 10, 2019
  by
Gary
Read More
技術筆記

現在的前端都在用 JavaScript「框架」?前端框架的功能與優點

現今前端的 JavaScript「框架」其實就是一種提升開發效率、降低維護難度的開發架構。主流的框架如 React、Vue 等,大都擁有這些特性。搜尋前端相關職缺,幾乎每間公司的職缺都會在求職條件或加分項目中提到目前的三大框架:React、Vue、Angular。這篇帶大家了解到底為什麼好像全世界都在用「框架」呢?

Posted on 
Oct 8, 2019
  by
Gary
Read More
技術筆記

認識VPS(Virtual Private Server)與GCP(Google Cloud Platform)

學習如何創建一台虛擬主機(Virtual Machine,簡稱 VM)並在主機上部署專案。為此我們會租用一台虛擬主機,設定虛擬主機上專案部署的環境,本篇將介紹提供 VM 的兩種雲端服務——Virtual Private Server(VPS)和 Cloud Computing。

Posted on 
Sep 16, 2019
  by
ALPHA Camp
Read More
技術筆記

RWD教學入門:響應式網頁設計的實作方法

RWD(Responsive Web Design)中文翻作「響應式網站設計」,是一種為了讓網頁在各種尺寸的裝置下,畫面都能呈現合適比例的設計原則。本文將嘗試用簡單的方式,由淺入深來介紹 RWD。並介紹RWD實作工具像是Flexbox、Grid、或使用 CSS 框架實作 RWD,例如 Bootstrap。

Posted on 
Sep 12, 2019
  by
Dez
Read More
技術筆記

BDD/TDD差別是什麼? 手把手用 Cucumber 實作示範BDD

上一篇文章介紹了TDD,這篇則說明BDD與TDD有何不同,講解BDD觀念,並用實際範例和工具Cucumber 示範如何進行BDD開發。BDD 的重要精神在於能更有效地發現問題、方便協作和示範。

Posted on 
Aug 26, 2019
  by
Yuni
Read More
技術筆記

TDD 開發五步驟,帶你實戰 Test-Driven Development 範例

本文將介紹如何進行 TDD(Test-Driven Development),並以一個簡單的題目,盡量用具體且易懂的方式,來示範傳統開發模式和 TDD 開發模式在流程和思維上的差異。

Posted on 
Aug 8, 2019
  by
Yuni
Read More
技術筆記

Memcached 實作示範 - 用Memory Cache優化系統效能

在後端效能優化中,快取(Cache)是常用的作法。透過快取來優化效能有多種實作技術,本文將介紹其中一種作法—用記憶體幫你快取—Memory Cache,並透過一個實際專案來示範,使用 Node.js 實作 memcached 快取

Posted on 
Jul 11, 2019
  by
Yuni
Read More
技術筆記

你的網站升級到 HTTP/2 了嗎?

你的網站升級到 HTTP/2 了嗎?

Posted on 
Jul 12, 2016
  by
Read More
技術筆記

DevOps 工程師的基本功,網路軟體架構最佳化

沒有最佳化的經驗,那碰到網站、App 流量大增怎麼辦?通常有點規模的新創公司會請所謂的 DevOps 工程師 (Development Operations Engineer),而 DevOps 的工作就是在於配置和建置公司的軟體架構。而在大型公司中,DevOps 通常又會再將資料庫管理、作業系統管理、程式碼管理等職務再細分。別慌,其實網路軟體架構最佳化基本功並不難上手,讓我們來聊聊。

Posted on 
Feb 23, 2016
  by
Read More
技術筆記

從麻瓜變大師:三個使用版本控制系統的關鍵心法

從麻瓜變大師:三個使用版本控制系統的關鍵心法

Posted on 
Jan 13, 2015
  by
ALPHA Camp
Read More