[指南] 線上 QR Code 產生器
在寫Blog、做簡報和報告的時候，常常會有需要使用 QR Code 的情形。這個網站所提供的 免費 QR Code 生成器 算是佛心、好用的生成器，而且還可以客 Read More …
分類: 網頁開發 Web Development
[筆記] 台灣縣市二聯式選單 tw-city-selector.js
最近的專案中，正巧需要給使用者填寫地址。那麼一個友善的表單，有個基本的縣市下拉式選單是很常見的(通常還會帶有郵遞區號3碼)。秉持著若已經有人造好輪子，那就不一定 Read More …
[筆記] Node.js 在 Windows 上的開發環境建置
這篇文章記載下於 Windows 上建置開發 NodeJS 相關應用的環境過程和步驟。 操作步驟 [crayon-5decf34fdf7b7428258096/ Read More …
[筆記] Heroku Sequelize 佈署細節
本篇記錄下如何將 SQL 關聯式資料庫佈署到 Heroku 上的步驟與心得。 操作步驟
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 |
// 1. Heroku 指定的資料庫是用 PostgreSQL，故先用 npm 安裝相關套件 npm i pg // 2. 調整 config/config.json 的設定 "production": { "use_env_variable": "DATABASE_URL", "dialect": "postgres", "protocol": "postgres", "dialectOptions": { "ssl": true } // 3. 建立 heroku 專案 heroku create // 4. 佈署到 heroku，在這一步若你的 git 存放位置和 package.json 不同，會導致佈署失敗。 git push heroku master // 5. 專案啟動 heroku ps:scale web=1 // 6. 在 heroku 上產生資料庫 heroku addons:create heroku-postgresql:hobby-dev // 7. 在 heroku 的資料庫內生成假資料 heroku run npx sequelize db:seed:all |
其他 Read More …
[筆記] HTML 表格 Table 的 tr td th 用法
HTML 中的表格格式，標頭常見的有 tr, td, th, thead, tbody。這篇是筆記一個表格其結構組成。 示範 [crayon-5decf34fd Read More …
[筆記] 運用 Heroku 佈署的初始化步驟
這篇文章記錄下如何將本機端的專案推撥到 Heroku 上的步驟。整體操作難度不高，但是要盡量讓 git 和 heroku 的檔案放在同一層。否則上傳時，hero Read More …
[筆記] 線上正規表示式測試器
在寫程式時，常會使用正規表示式 (Regular Expression) 來比對資料的相對性。不過其指令相當的不直覺，為了避免浪費過多的測試時間，所以這回找到 Read More …
[筆記] TinyURL 服務串接
TinyURL 縮網址服務，網友一般戲稱為 台泥。這算是老牌的縮網址服務了，成立於2002年。不過官方一直沒有公布相關的服務串接API介面，不過從網路上找到相關 Read More …
運用 Node.js 建網站的初始化步驟
AlphaCamp 的課程進入到第三學期後期，趁機整理一下如何運用 Node.js 來建立一個簡單網站的步驟(包含前端畫面、後端資料庫、登入頁面、串接API以及 Read More …
[筆記] JavaScript 雙層選單篩選連動
在網頁前端開發中常見的雙層以上的篩選器，要怎麼順利的傳遞兩個以上的參數到後端呢？運用一些設計上的小技巧就可以辦到了。 解決方法 基本上，當使用者第一次傳遞參數到 Read More …
[筆記] Heroku 佈署問題：如何將 Git 的子資料夾專案推上雲端？
當運用 Heroku 佈署專案時，若你的專案資料夾是位於某個 Git 的子資料夾下的話，那就會遇到 Heroku 說讀取不到你的設定檔(如 Node.js 的 Read More …
[筆記] Google, Facebook, Github OAuth 認證設定申請
方前在網頁開發時，說要做個使用者登入介面串接，那最方便的選擇非 OAuth 2 的技術了。不過 Google, Facebook 和 Github 的設定頁面有 Read More …
Mongo DB 條件操作符
初接觸 Mongo DB，就順帶記錄一下常常用到的查詢指令 – db.collection.find() 的用法。 指令結構： db.collect Read More …
Express Validator 操作介紹
express.js 相關的套件之一，Express Validator，可以幫助設計者節省在表單驗證下的難處。 下載與官方文件 Github：https:// Read More …
安裝 MongoDB 出現 SocketException: Address already in use 錯誤
初次安裝並啟動 MongoDB 時，若不小心關閉終端機而沒有將伺服器關閉，這時重新啟動時，就會出現此錯誤。本文是要記錄下如何解決這小狀況的方法。 問題原因 之前 Read More …
[筆記] KeyCode & querySelectorAll 全部加上事件
這回想要實作的狀況是：當使用者在輸入框中按下 “Enter” 後，可以選取到表格中的每一橫列。若要達成這個目的，你需要知道 KeyCod Read More …
[筆記] Can I Use 查詢語法在各瀏覽器上可否正常使用
在瀏覽器上要使用新語法之前，常會必須考慮掉舊的瀏覽器是否兼容的問題。Can I Use 是用來查詢各種語法在瀏覽器上的相容性為何。 使用方法 1.登入 Can Read More …
[筆記] JavaScript 將兩個 array 合併一個 array
最近在網路上找資料練習串接資料時，頭一次遇上陣列裡有陣列的狀況。筆記一下如何運用 JavaScript 的 “Array.prototype.con Read More …
[筆記] 純 CSS 製作圖片輪撥效果
先前在練習刻畫網頁時，想說做個圖片輪撥器試試。不過在不用 JavaScript 的情況下，單純用CSS3 也可以達到一樣的效果。 語法解說 其實跟過往運用 Fl Read More …
[筆記] API 串接, Axios 和綁定DOM事件
在 Alpha Camp 的第二學期課程中，有提到寫個網頁來向遠端伺服器請求資料，故整理一下自己腦海中所學到的技巧與觀念。 重點提示 運用 “Axi Read More …
[筆記] CSS ul li 水平置中方法
若在前端網頁設計中，使用了 <li> 來製作水平選單時，有機會遇到無法水平置中的問題。這邊收集了兩種方法來解決。 (P.S. 若是要水平左右端，運用 Read More …
