前後に項目の考え方が分離されていません.

19063 ワード

node nodejs

1.プロジェクトはnodeの中でexpressのプロジェクトジェネレータを使って、nodeの中npmのパッケージマネージャを使ってexpress-generatorツールをダウンロードして、終わったらexpress project Nameコマンドで構築して、expressの後は作成したプロジェクト名です.などの操作をして、nodemonのツールを自動的に更新しました.毎回のスイッチサービスは不要です.(具体的な操作で知りたいことは聞いてもいいです.ここは書きません.)
2ページはbootstrapからcv大法でテンプレートを探して、パスを変えて、削除して、いくつかの配置を追加しました.公共部分は別々のファイルに置いて、includeを使って書式を挿入します.
3.ルーティングを設定し、expressモジュールを導入し、expressにはRouterの方法の後と二つのパラメータがあります.【最初は設定されたルーティングアドレスを入れることです.(ap.jsファイルに設定し、ap.useコマンドで設定した:ap.use('/pro'、proRouter).最初のパラメータは設定されたルートパスで、2番目のパラメータは専用のルートファイルです.】このファイルはRouterメソッドの前に導入されます.var prorouter=require('./routes/pro'))、ルーティングの承認要求によって受信された2つのパラメータ:router.get('/',function(req,next){res};最初のパラメータはルートパス、2番目は関数、3つのパラメータを関数に入れました.最初はreq要求ヘッダ、2番目のレスポンスヘッダ、3番目のnextです.ここでnextは下のルーティング要求をブロックするのを防ぐためです.その後、res.render()をとります.方法レンダリングテンプレートは、この方法にも2つのパラメータがあります.最初のパラメータは静的ページのパスです.2番目のパラメータは対象です.中に静的ページに必要な変数を入れて、構成が終わったらモジュールを露出してください.ルート構成が終わったらナビゲーション用aタグを閉じて、ここにジャンプしてもう1行のコードを補充してください.これはルートのリダイレクトです.データの追加が完了したら、最新のデータを返して表示する時に、ルートに戻るべきパスを見つけたらいいです.コードを入れて詳細に説明します.
コードは全部入れません.まずnodeサーバコードを入れます.

var createError = require('http-errors');
var express = require('express');
var path = require('path');
var cookieParser = require('cookie-parser');
var logger = require('morgan');

var indexRouter = require('./routes/index');
var proRouter = require('./routes/pro');
var lbtRouter = require('./routes/lbt');
var informRouter = require('./routes/inform');
var shoppingRouter = require('./routes/shopping');
var userRouter = require('./routes/user');

var app = express();

// view engine setup
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'ejs');

app.use(logger('dev'));
app.use(express.json());
app.use(express.urlencoded({ extended: false }));
app.use(cookieParser());
app.use(express.static(path.join(__dirname, 'public')));

app.use('/', indexRouter);
app.use('/pro', proRouter);
app.use('/lbt', lbtRouter);
app.use('/inform', informRouter);
app.use('/shopping', shoppingRouter);
app.use('/user', userRouter);

// catch 404 and forward to error handler
app.use(function(req, res, next) {
  next(createError(404));
});

// error handler
app.use(function(err, req, res, next) {
  // set locals, only providing error in development
  res.locals.message = err.message;
  res.locals.error = req.app.get('env') === 'development' ? err : {};

  // render the error page
  res.status(err.status || 500);
  res.render('error');
});

module.exports = app;

上に結び付けるとよくわかるはずです.
静止ファイルプロ.ejsフォーマットを再生します.






  
  
  AdminLTE 2 | Starter
  
  
  
  
  
  
  
  
  
  
  

  
  
  

  
  




  

    
      
      

        
        
          
            
              
                      
              
              
              
                
                  
                    
                      Show  entries
                    
                    
                      Search:
                    
                    
                          を  
                    

                  
                  
                    
                      
                        
                          
                              
                              
                            LOGO
                              
                              
                              
                              
                              
                              
                              
                              
                              
                          
                        
                        
                          
                            DATA
                            DATA
                            DATA
                            DATA
                            DATA
                            DATA
                            DATA
                            DATA
                            DATA
                            DATA
                            DATA
                            DATA
                          
                        
                      
                    
                  
                  
                    
                      Showing 1 to 10
                        of 57 entries
                    
                    
                      
                        
                          Provious
                          1
                           のテキスト

		LOGO
DATA	DATA	DATA	DATA	DATA	DATA	DATA	DATA	DATA	DATA	DATA	DATA

addform.ejsをもうつれます.






  
  
  AdminLTE 2 | Starter
  
  
  
  
  
  
  
  
  
  
  

  
  
  

  
  




  

    
      
      

        
        
              
                      
              
              
                
                         
                
                
                
                
                  
                    
                        
    
                      
                        
                      
                    
                    
                      LOGO

＜script src=「/javascripts/bootstrap.min.js」/>

＜script src=「/javascripts/adminlte.min.js」/>
＜p＞ルーティングプロファイルpro.js

var express = require('express');
var router = express.Router();

/* GET users listing. */
router.get('/', function(req, res, next) {
  res.render("pro",{
    index:3
  })
});


router.get('/add', function(req, res, next) {
  res.render("addform",{
    index:1
  })
});


router.post('/addAction', function(req, res, next) {
  console.log(req.body);
  res.redirect("/pro")
});

module.exports = router;

これはさいのページだけがです. ににくとかりやすく、です. ではない!!!!!!!!!!!!!!!!!!!!!!
そのpostはのなテンプレートのフォームにして、actionタグでしいルートをきました.index はクリックをし、クリックスタイルをします.