This is the 31st day of my participation in the August Text Challenge.More challenges in August

Why choose egg

  • For the front end of a beginner node. I prefer something mature and formal. Then understand it.

What is an egg. Js

Egg.js is a framework developed by the Alibaba team for enterprise frameworks and applications based on the KOA framework, which was developed by the original express framework team. Egg chose Koa as its base framework, and made some further enhancements to it based on its model.

Express is a framework widely used by the Node.js community. It is simple and extensible, perfect for personal projects. But the framework itself lacks conventions, and the standard MVC model can be written in all sorts of strange ways. Egg is developed by convention, by convention over configuration, with low teamwork costs.

The installation

It is recommended to use scaffolding directly to quickly generate projects with a few simple commands: eggjs.org/zh-cn/intro…

$mkdir egg-example && CD egg-example $NPM init egg --type=simple $NPM I $ npm run dev $ open http://localhost:7001Copy the code

npm

www.npmjs.com/package/egg…

$ npm i egg-init -g
$ egg-init -h

Copy the code

See directory convention

Eggjs.org/zh-cn/basic…

Video tutorial

www.bilibili.com/video/av383…

Video courseware

  • pan.baidu.com/s/1a8-RY-aBm3YkH2ZqJKmztg
MVC /app in egg
  • The Controoller controller is responsible for processing some service logic
  • Serviece services (models) work with data (query databases, request data)
  • View Displays the view template page
Middleware in egg
  • Middleware middleware
Extend framework extension
Schedule A scheduled task

routing

Get parameters, and dynamic route parameters of the configuration method

Define the routing middleware in app/ Controller, create news.js, and create a controller and method

Dynamic route parameters ctx.params Parameter obtaining method ctx.query

'use strict'; const Controller = require('egg').Controller; class NewsController extends Controller { async index() { const { ctx } = this; console.log(ctx.query); Ctx.body = ctx.query; } async list() {const {CTX} = this; console.log(ctx.params); Ctx.body = ctx.params; Module. exports = NewsController;Copy the code

Add it to router.js

'use strict';

/**
 * @param {Egg.Application} app - egg application
 */
module.exports = app => {
  const { router, controller } = app;
  router.get('/', controller.home.index);
  router.get('/home', controller.home.myhome);
  router.get('/news', controller.news.index);
  router.get('/news/list:id', controller.news.list);
};
Copy the code
Use the View template

Here we use an egg – view – ejs see www.npmjs.com/package/egg…

npm i egg-view-ejs --save
Copy the code

Configure the plugin

// {app_root}/config/plugin.js
exports.ejs = {
  enable: true,
  package: 'egg-view-ejs',
};
Copy the code

Configure the view,

// {app_root}/config/config.default.js
exports.view = {
  mapping: {
    '.ejs': 'ejs',
  },
};
Copy the code

The code after configuring the view is

/* eslint valid-jsdoc: "off" */ 'use strict'; /** * @param {Egg.EggAppInfo} appInfo app info */ module.exports = appInfo => { /** * built-in config * @type {Egg.EggAppConfig} **/ const config = exports = {}; // use for cookie sign key, should change to your own and keep security config.keys = appInfo.name + '_1562745060241_7841'; // add your middleware config here config.middleware = []; View = {mapping: {'.html': 'ejs', // Config. view = {mapping: {'.html': 'ejs', // config.view = {mapping: {'.html': 'ejs', // Config. view = {mapping: {'.html': 'ejs',}; // add your user config here const userConfig = {myAppName: 'egg',}; return { ... config, ... userConfig, }; };Copy the code

Then you can start using index.html in app/ View

The < body > < h3 > accept to string: < % = MSG % > < / h3 > < ul > < % for (var I = 0; i<list.length ; i++) {%> <li><%=list[i]%></li> <% } %> </ul> </body>Copy the code

Specify the parse template in the controller by noting that each function is async and the parse template is required for an asynchronous operation

Parse the template with await ctx.render

async index() { const { ctx } = this; Const MSG = 'pass in a string '; const list = [ 111, 222, 333 ]; await ctx.render('index', { msg, list, }); }Copy the code
How do I use static resources
<img SRC ="/public/images/1.jpg">Copy the code
Why typings

www.jianshu.com/p/5447f65cd…

NPM install typings –global // install typings

Github.com/typings/typ…

Blog.csdn.net/z_sherry/ar…

See support for installing mysql

Eggjs.org/zh-cn/tutor…