偽裝成人類的前端工程驢

目前顯示的是有「javascript」標籤的文章顯示全部

inwebpack

[day22][前端][實作] 用webpack自架Vue3環境（上）

驢子 11月 18, 2020

引入Vue3 前端框架檔案的引入，這邊會分成三篇講解。上篇是Vue3的引入，中篇是routes和Vuex的引入，下篇則是Vue3的運用。自架webpack編譯Vue3 Vue3已經正式發布了。大部分的情況下也不需要自架webpack來編譯Vue的檔案，畢竟Vue Cli不香嗎？但是想到想想Vue他可能包了很多不知道的套件，而且自己架比較好玩不是嗎=w= 從安裝對應套件開始吧～！這邊為了避免版本錯誤請將直接複製以下"package.json"後使用，當然你也可以一個一個安裝！所以也可以一個一個安裝，但請理解因為他正在轉型所以安裝的指令和出來的版本可能會有各式各樣的不相容（但解這個的過程可以讓你更好的理解webpack設定對於版本相容有多麻煩，和package.json對一個專案為什麼那麼重…

閱讀完整內容

innodejs

[day14][後端][實作] CRUD，用mongoose去修改MongoDB

驢子 11月 18, 2020

mongoose的簡單使用方法上一篇中使用的"mongoose"有許多定義好的方法可以使用，最好先宣告幾個方法統一呼叫才會比較方便。請跟著下面的流程好好的重構一下程式碼！個人習慣針對資料庫的操作會統一宣告在一個資料夾內保管，所以首先建立資料夾"models"在建立放置資料庫模型的js檔"schemaModels.js"然後依照練習用的範例資料庫一一建立模型 models\schemaModels.js let mongoose = require ( 'mongoose' ); const accounts = new mongoose.Schema({ account_id : { type : Number }, …

閱讀完整內容

innodejs

[day13][後端][學習] 串接，雲端MongoDB Atlas資料庫（下）

驢子 11月 18, 2020

前情題要上一篇我們註冊了雲端DB並且完全沒有碰程式碼，現在就讓我們來開始動程式碼。該用哪個套件處理mongodb？？ mongodb VS mongoose 可以參考這篇文章 Performance Difference in Mongoose vs MongoDB Native Driver ，這邊會選擇使用mongoose，因為使用上比較簡單。如果使用mongodb速度會比較快因為他能控制到相當底層的東西。本篇使用的是mongoose所以沒辦法使用範例程式碼，請使用下面的程式碼。首先安裝"mongoose" npm i --save mongodb app.js 略 const mongoose = require ( 'mongoose' ); co…

閱讀完整內容

innodejs

[day12][註冊][實作] 串接，雲端MongoDB Atlas資料庫（上）

驢子 11月 18, 2020

mLab與heroku分手原本串接雲端資料庫這篇應該是會放在之後才會講到的，想說先安裝本地端資料庫在開發的時候比較省流量。但是因為mLab預計在未來從heroku可以快速建成的app消失，所以重新找了雲端資料庫要用哪一個。發現買下mLab的MongoDB Atlas服務並沒有限制呼叫次數，加上可以選擇台灣伺服器所以乾脆從一開始就串接雲端資料庫！你遲早要串接雲端資料庫為什麼不現在就串！前往 mongodb atlas 官方網站註冊帳號（我是用google直接進入）同意隱私權政策經過一段歡迎光臨的畫面後來這個畫面你必須要隸屬一個組織才可以開始建立專案建立完成就會看到下面這畫面接著建立你的第一個專案現在你擁有了第一個專案，點開左下角start按鈕依序完成 step 01 Build your fi…

閱讀完整內容

innodejs

[day11][後端][學習] 沒朋友就用LineBot機器人做一個（下）

驢子 11月 18, 2020

製作你的LineBot機器人（拆解）現在要來拆解LineBot範例伺服器的程式碼了，會一段一段進行講解並慢慢拆解。請跟著一起慢慢前進吧！範例程式檔 'use strict' ; // 這是說要使用嚴格模式，請google const line = require ( '@line/bot-sdk' ); // line套件喔！ const express = require ( 'express' ); // create LINE SDK config from env variables const config = { channelAccessToken : process.env.CHANNEL_ACCESS_TOKEN…

閱讀完整內容