學期2-3 : Week 2 To-do List:CRUD & Mongo DB ORID

更新 發佈閱讀 4 分鐘

Objective

本周目標為順利完成資料庫的串接與運用路來熟悉資料庫CRUD的功能,同時再次複習除了連線資料庫以外,建立一個Express專案所需要的基本流程,包含從使用npm init -y初始化專案、安裝express、建立handlebars、到最後新增.gitignore檔案,將專案於本機進行版本控制。

Reflective

這周先利用密碼產生器讓我再熟悉一次express專案建立的流程,並學習如何透過<form>建立表單輸入的各種要求,在這階段與之前較大的差異是加上了POST這個http方法,由於透過GET來建立request時,會將傳送的資料顯示在網址列上,而一般我們在輸入input可能會有密碼、生日等個資,所以通常會改用POST這個方法。而值得注意的是,最後則要再注意使用POST請求,要解析待資料的req.body物件時,應該要使用body-parser這個套件,來處理表單前端所送出的資料。
此外,這周第二個重點則是透過To-do list清單來練習使用文件式資料庫。我們使用的文件式資料庫為MongoDB,然後透過JavaScript 撰寫Mongoose提供的語法,將其翻為可以操作資料庫的語法。其用到的CRUD操作有如下:

  • 透過.find()瀏覽所有資料
  • 透過.create()新增資料
  • 透過.findById()與params取得特定清單
  • 透過.findById()與.save()修改特定清單
  • 透過.findById()與.remove()刪除特定清單

最後教材會再透過流程圖顯示MVC架構各元件的溝通,也讓我可以更清楚再使用不同HTTP 方法與路由後會到輸出哪個樣板的畫面,比較特別的是,這次階段的學習也真正開始操作資料庫,也算是慢慢對網頁工程師整體的會用運的技術與架設網頁的流程有了最基本的認識。

Interpretive

踏入串接資料庫的步驟雖讓我自己覺得往成為工程師更靠近的一步,但其實第一步在連線資料庫的時候就遇到許多困難,因為抓不到環境變數一直無法找到鄭去的URI,對於這種不是因為程式邏輯上的挫折確實後來帶給我些學習上的阻力,覺得為什麼要花這麼多時間研究一個好像與自己技術能力沒什麼大多關聯的事物,且網路上的解決方式也跟教材預設差異較大,最後還是無法設定環境變數,而是直接在mongoose.connect()帶入原先取得的URI資訊,這是之後還需要修改的地方。


Decisional

第二周較有困難的學習在於環境變數的設定與MVC架構裡面controller、view、model之間的溝通,發現如果全部遮起來,就比較難透過自己的話說出修改前端畫面資料到寫入後端資料庫所經過的所有流程,覺得之後應該要花更多時間在於思考各元件之間是如何做串接,才會對在app.js輸入路由的各個動作與整體專案何時要新增partial template、哪個handlebars要更改架構、到整體專案接到請求到送出回應的流程更為熟悉。

留言
avatar-img
留言分享你的想法!
avatar-img
Blockcyber的沙龍
2會員
15內容數
紀錄轉職路上的點點滴滴
Blockcyber的沙龍的其他內容
2023/01/18
Introduction to WebRTC 由於之後想要做的專題是跟即時視訊相關,在開始作業前想對webrtc有些基本的了解,結果就是一踏入了解就發現這個水深的可怕,之後每天除了寫一點go,也會花時間學習這個協定。WebRTC是個用於瀏覽器之間溝通的協定,透過NAT Traversal(STUN、
Thumbnail
2023/01/18
Introduction to WebRTC 由於之後想要做的專題是跟即時視訊相關,在開始作業前想對webrtc有些基本的了解,結果就是一踏入了解就發現這個水深的可怕,之後每天除了寫一點go,也會花時間學習這個協定。WebRTC是個用於瀏覽器之間溝通的協定,透過NAT Traversal(STUN、
Thumbnail
2023/01/17
Stress testing 一早起床發現昨天辛苦整天網站又不能跑了,去看error.log發現原來是有其他服務使用到了80port,造成根本監聽不到,再去找找看是那些服務,結果可能是apache2使用到,直接怒sudo service apache2 stop,網站就恢復正常了。 今天除了再多熟悉
Thumbnail
2023/01/17
Stress testing 一早起床發現昨天辛苦整天網站又不能跑了,去看error.log發現原來是有其他服務使用到了80port,造成根本監聽不到,再去找找看是那些服務,結果可能是apache2使用到,直接怒sudo service apache2 stop,網站就恢復正常了。 今天除了再多熟悉
Thumbnail
2023/01/16
What the hack? 昨天信誓坦坦想說要將每天學習心得做一點紀錄,結果今天只做一件事,就是要把網站加上SSL憑證,再到Nginx做設定,以為一小時內就搞定的事情就處理了一整天...,可能是沒有分號、可能是url少了/符號、可能是沒有做port的導向、也可能檔案路徑設定錯誤,真的心中各種不甘,
Thumbnail
2023/01/16
What the hack? 昨天信誓坦坦想說要將每天學習心得做一點紀錄,結果今天只做一件事,就是要把網站加上SSL憑證,再到Nginx做設定,以為一小時內就搞定的事情就處理了一整天...,可能是沒有分號、可能是url少了/符號、可能是沒有做port的導向、也可能檔案路徑設定錯誤,真的心中各種不甘,
Thumbnail
看更多
你可能也想看
Thumbnail
在小小的租屋房間裡,透過蝦皮購物平臺採購各種黏土、模型、美甲材料等創作素材,打造專屬黏土小宇宙的療癒過程。文中分享多個蝦皮挖寶地圖,並推薦蝦皮分潤計畫。
Thumbnail
在小小的租屋房間裡,透過蝦皮購物平臺採購各種黏土、模型、美甲材料等創作素材,打造專屬黏土小宇宙的療癒過程。文中分享多個蝦皮挖寶地圖,並推薦蝦皮分潤計畫。
Thumbnail
小蝸和小豬因購物習慣不同常起衝突,直到發現蝦皮分潤計畫,讓小豬的購物愛好產生價值,也讓小蝸開始欣賞另一半的興趣。想增加收入或改善伴侶間的購物觀念差異?讓蝦皮分潤計畫成為你們的神隊友吧!
Thumbnail
小蝸和小豬因購物習慣不同常起衝突,直到發現蝦皮分潤計畫,讓小豬的購物愛好產生價值,也讓小蝸開始欣賞另一半的興趣。想增加收入或改善伴侶間的購物觀念差異?讓蝦皮分潤計畫成為你們的神隊友吧!
Thumbnail
MySQL 應用到 URL Shortener 上
Thumbnail
MySQL 應用到 URL Shortener 上
Thumbnail
建置好前端後, MERN全端工程師教學在這裡 想學習MongoDB和Express可以來這裡學習
Thumbnail
建置好前端後, MERN全端工程師教學在這裡 想學習MongoDB和Express可以來這裡學習
Thumbnail
最近接獲一個任務,該任務的目標是替一個即將進入正式部署階段的系統,導入一個 database migration tool,以下是此任務整個思考決策的邏輯以及正式進行時技術上比較值得和大家分享的小細節。 系統背景 資料庫的設計方式,目前常見會有兩種方向,code first 以及 database
Thumbnail
最近接獲一個任務,該任務的目標是替一個即將進入正式部署階段的系統,導入一個 database migration tool,以下是此任務整個思考決策的邏輯以及正式進行時技術上比較值得和大家分享的小細節。 系統背景 資料庫的設計方式,目前常見會有兩種方向,code first 以及 database
Thumbnail
Connect database 因爲我們後端是用 django,所以我們要用 python 來操作 MongoDB,MongoDB 官方推薦的 python driver 是 pymongo,首先來安裝 在想使用的檔案內加入 myclient = pymongo.MongoClient("mong
Thumbnail
Connect database 因爲我們後端是用 django,所以我們要用 python 來操作 MongoDB,MongoDB 官方推薦的 python driver 是 pymongo,首先來安裝 在想使用的檔案內加入 myclient = pymongo.MongoClient("mong
Thumbnail
上一篇有提到 MongoDB Compass,而且也已經裝好了,那就來介紹一下吧 MongoDB Compass 是官方做的圖形介面工具用來操作架好的 MongoDB service,這樣就不用什麼事情都辛苦的用 mongo shell 操作了 New connection 輸入想要連接的 Mong
Thumbnail
上一篇有提到 MongoDB Compass,而且也已經裝好了,那就來介紹一下吧 MongoDB Compass 是官方做的圖形介面工具用來操作架好的 MongoDB service,這樣就不用什麼事情都辛苦的用 mongo shell 操作了 New connection 輸入想要連接的 Mong
Thumbnail
假設資料如下: local DB裡面的test Collection SELECT SELECT可以這樣寫: 由於config/database.php中設定的default DB_CONNECTION是mysql,所以這邊特別指定使用mongodb connection。 回傳結果如下: 軟刪除
Thumbnail
假設資料如下: local DB裡面的test Collection SELECT SELECT可以這樣寫: 由於config/database.php中設定的default DB_CONNECTION是mysql,所以這邊特別指定使用mongodb connection。 回傳結果如下: 軟刪除
Thumbnail
S1.建立資料庫 user S2.建立 index.htm a.載入 vue.js、jquery、bootstrap b.版面建立 S3.vue.js程式 新增、查看列表、互動視窗、修改、刪除 index.htm VueControl.js 原碼:https://reurl.cc/e3k8yL
Thumbnail
S1.建立資料庫 user S2.建立 index.htm a.載入 vue.js、jquery、bootstrap b.版面建立 S3.vue.js程式 新增、查看列表、互動視窗、修改、刪除 index.htm VueControl.js 原碼:https://reurl.cc/e3k8yL
追蹤感興趣的內容從 Google News 追蹤更多 vocus 的最新精選內容追蹤 Google News