標籤：nodejs mongodb extjs login express
學習新技術最快捷的方式就是做項目。在第一天的環境搭建好後，我就準備基於Nodejs+Extjs+Mongodb來做一個Web系統。
環境搭建：http://blog.csdn.net/jrainbow/article/details/38845639
一、技術選擇的原因1、Nodejs。這個不用說了，就是為了學習這個來的。因為要做的是Web系統，所以選擇了Express架構。
2、Extjs。原因也很簡單，因為筆者的美工不行，而且之前有使用過Extjs架構。為了更滿足自己的銀彈心理，這個項目選擇了基於Extjs4.x版本的desktop架構。
3、Mongodb。搭建及使用起來都比較簡單。相對於筆者之前用過的HBase，Mongodb依賴性低太多。Mongodb直接下載回來解壓就能用。
Mongodb的簡單使用:http://blog.csdn.net/jrainbow/article/details/39163843
目錄如下：
bin ，存放預設啟動的指令碼doc, 存入項目的文檔modules, 用來存放資料模型。類似JavaEE開發中的Entity與Dao的結合體。當然，你也可以拆開成modules與daos兩個目錄node_modules, 存放所有的項目依賴庫。類似Java中的jar包目錄。 public, 靜態檔案(css,js,img)。我也把頁面的JavaScript檔案放在這個目錄下。routes, 路由檔案(MVC中的C,controller) 。相當於JavaEE開發中的Controller及Service的結合。當然這裡也可以拆開。views, 分頁檔(Ejs模板) 。相當於html或jsp頁面。package.json, 項目依賴配置及開發人員資訊。相當於Maven的座標設定檔。app.js, 程式開機檔案
<!DOCTYPE html><!--[if lt IE 7 ]> <html lang="en" class="ie6 ielt8"> <![endif]--><!--[if IE 7 ]> <html lang="en" class="ie7 ielt8"> <![endif]--><!--[if IE 8 ]> <html lang="en" class="ie8"> <![endif]--><!--[if (gte IE 9)|!(IE)]><!--> <html lang="en"> <!--<![endif]--><head> <meta charset="utf-8"> <title>簡單客戶關係管理系統</title> <link rel="stylesheet" type="text/css" href="/stylesheets/login.css" /></head><body><div class="container"> <section id="content"> <form action="/check" method="get"> <h1>登入</h1> <div> <input type="text" placeholder="使用者名稱" required="" id="username" name="username" /> </div> <div> <input type="password" placeholder="密碼" required="" id="password" name="password"/> </div> <div> <input type="submit" value="登入" /> <a href="#">忘記密碼?</a> <a href="#">聯絡我們</a> </div> </form><!-- form --> <div class="button"> <a href="#">試用版本下載</a> </div><!-- button --> </section><!-- content --></div><!-- container --></body></html>
var express = require('express');var router = express.Router();/* GET home page. */router.get('/', function(req, res) { res.render('login');});router.get('/check', function(req, res) {
console.log(req.query.username); console.log(req.query.password);});module.exports = router;
在app.js檔案中，在檔案頭先匯入login的路由模組
var login = require('./routes/login');
設定login路由的訪問路徑
app.use('/', login);app.use('/main', main);
輸入使用者名稱和密碼:admin + test
後台終端顯示:
我們的頁面資料與背景http通道已打通。明天我們進行編寫登入校正的邏輯。
Nodejs+Extjs+Mongodb開發第三天 登入頁面(1)
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
