ejs

Deno 静态页面或图片 视频讲解 https://www.bilibili.com/video/BV1BT4y1E7Nh/?p=7 我们一起来完成以下步骤: 沿用之前的工程代码 新增Login页面和响应的controller 添加CSS资源文件,然后预览页面 #controllers/controller.ts const { cwd } = Deno; class Controller { static async getData(ctx: any){ //cwd获取当前工程目录 //注意 ' ！== ` ctx.render( ` ${cwd()} /views/index.ejs` ,{ title : "Testing" , data :{ name : "deepincoding" } }); } //登录页面 static async login(ctx: any){ ctx.render( ` ${cwd()} /views/login.ejs` ); } } export default Controller; #routers/index.ts import { Router } from "https://deno.land/x/oak/mod.ts" ; import Controller from "../controllers/Controller.ts

Deno上传文件 视频讲解 https://www.bilibili.com/video/BV1BT4y1E7Nh/?p=6 我们一起来完成以下步骤: 沿用之前的工程代码 创建上传页面和响应的controller 添加上传文件功能 测试 #controllers/controller.ts const { cwd } = Deno; class Controller { static async getData(ctx: any){ //cwd获取当前工程目录 //注意 ' ！== ` ctx.render( ` ${cwd()} /views/index.ejs` ,{ title : "Testing" , data :{ name : "deepincoding" } }); } static async uploadPage(ctx: any){ ctx.render( ` ${cwd()} /views/upload-page.ejs` ); } static async uploadAction(ctx: any){ //我们这里不返回页面，而是返回上传文件的信息 ctx.response.body = ctx.uploadedFiles; } } export default Controller; #routers/index.ts import { Router

视频演示 https://www.bilibili.com/video/BV1BT4y1E7Nh/?p=9 我们一起来完成以下步骤: 使用之前工程的代码 创建数据库脚本 创建数据库连接 新增员工model 创建员工仓库类repositories 创建员工services类 添加增删查改代码 #controllers/employeeController.ts import { Context } from "https://deno.land/x/oak/mod.ts" ; import { Employee } from "../models/employee.ts" ; import employeeService from "../services/employeeService.ts" ; const { cwd } = Deno; class Controller { static async hello(ctx: any){ //cwd获取当前工程目录 //注意 ' !== ` ctx.render( ` ${cwd()} /views/index.ejs` ,{ title : "Testing" , data :{ name : " Deepincoding" } }); } static async save(ctx: Context){ const

视频演示： https://www.bilibili.com/video/BV1BT4y1E7Nh/?p=10 一起来完成以下步骤: 使用之前工程代码(09.MySQL增删查改API)),如果你还没有看过09视频，建议看一下 添加CRUD页面，使用ejs 页面模板 修改Controller相应的CRUD代码(Service到Repository层无需修改代码) 测试 #controllers/employeeController.ts //后台redirect import { Context, REDIRECT_BACK } from "https://deno.land/x/oak/mod.ts" ; import { Employee } from "../models/employee.ts" ; import employeeService from "../services/employeeService.ts" ; //解析Form import { multiParser } from 'https://raw.githubusercontent.com/deligenius/multiparser/master/mod.ts' const { cwd } = Deno; class Controller { static async list(ctx: any )

ejs:类似一个html文件，但是不能在当前页面直接通过浏览器打开页面，必须通过服务器来打开 1、输出： 在页面中输出变量值，你可以这么用： <div><%= var01 %></div> 如果不希望变量值的内容被转义，那就这么用：<div><%- var01 %></div> 2、模块的逻辑支持 所有使用 <% %> 括起来的内容都会被编译成 Javascript，你可以在模版文件中像写 js 一样 Coding，也允许你声明变量，作用域就是当前模版，因为一个模版会被编译 成一个 Javascript 函数。 <% var name = "littledu" %> <div> Hello, My Name is <%-name %> </div> 3、循环 就像写 Javascript 一样 <ul> <% for(var i = 0; i < 10; i++) {%> <li>我是列表 <%-i %></li> <% } %> <ul> 4、Includes的用法 Include 可以引用相对路径的模版文件，例如有 html/index.html 和 html/_block/head.html这两个文件， 你就可以在 index.html 这么用 <% include _block/head.html %>。 <ul> <% users.forEach(function

我们的需求 在 中，核心的就是渲染器，它提供了最基础渲染能力，有了它，你可以实现微前端、微服务、远程组件、首屏渲染，甚至可以和 React、EJS 等配合使用。 它可以和怎样的你协作？ 如果你是传统的后端渲染的，需要做SEO，但是你希望在部分布局，部分页面引入 Vue，那么 renderer.renderJson() 足以，将渲染结果传递给后端渲染的模板引擎中即可。 如果你是中后台系统，业务系统全部集中在一个项目，你希望可以按照业务进行服务的拆分，那么 `` 足以 如果你是 CSR 渲染的项目，那么 renderer.renderHtml({ mode: 'csr-html' }) 足以 如果你是 SSR 渲染的项目，那么 renderer.renderHtml({ mode: 'ssr-html' }) 足以 如果你想做微前端、微服务、那么 渲染器 天生就具备了这样的能力，你可以把它当成一个工具函数使用，你可以通过 HTTP 、 RPC 等等各种协议访问到你的服务，然后使用它进行渲染 创建一个渲染器 开发环境 import { SSR } from '@fmfe/genesis-core' ; import { Watch } from '@fmfe/genesis-compiler' ; ​ const start = async () => { const ssr = new

视频讲解: https://www.bilibili.com/video/BV1BT4y1E7Nh/?p=8 我们一起来完成以下步骤: 以key-value方式传参 以value方式传参 使用oak Helpers 接受传参 body 传参 header 传参 #controllers/controller.ts import { getQuery } from "https://deno.land/x/oak/helpers.ts" ; const { cwd } = Deno; class Controller { static async hello(ctx: any){ //cwd获取当前工程目录 //注意 ' !== ` ctx.render( ` ${cwd()} /views/index.ejs` ,{ title : "Testing" , data :{ name : " Deepincoding" } }); } //key-value 方式传参 static async searchParams(ctx: any){ var id = ctx.request.url.searchParams.get( "id" ); var name = ctx.request.url.searchParams.get( "name" ); ctx.response.body

序章 想要一个自己的知识管理系统，用了 Hexo ，但是没有发现自己心仪的主题，就自己做了一个。本文记录了制作的全过程。本人编码功底和前端知识并不是特别雄厚，希望能由此文引出各路大神的兴趣，以后制作出更多优秀的主题。 预览： https://itabyss.github.io/ 源码： https://github.com/ITAbyss/hexo-wiki 教程文章： https://www.cnblogs.com/yyhh/p/11058985.html 安装 Hexo 是一款能将『 Markdown 』文件编译成『 html 』静态文件，可以提供『 Web 』服务，做『 Blog 』，使其能部署到『 gitpage 』上等等。首先要安装『 node.js 』，安装好了以后，就可以使用『 npm 』来安装了，可能会读取系统配置文件，所以需要给『 root 』权限，使用『 sodu 』执行以下命令 $ sudo npm install -g hexo-cli /usr/local/bin/hexo -> /usr/local/lib/node_modules/hexo-cli/bin/hexo > fsevents@1.2.4 install /usr/local/lib/node_modules/hexo-cli/node_modules/fsevents > node

#Deno MongoDB 增删查改 接口 视频演示: https://www.bilibili.com/video/BV1BT4y1E7Nh/?p=10 一起来完成以下步骤: 使用上个工程代码(09.mysql增删查改工程)。 如果你没有看上个视频，建议看一下。 本节将不在重复的之前的内容和代码 修改employee 实体类，把ID删除掉 新增mongodb 数据库连接 修改仓库类的增删查改(controller到service层基本上不用修改代码) 测试 运行命令 deno run --allow-net --allow-write --allow-read --allow-plugin --unstable main.ts #controllers/employeeController.ts import { Context } from "https://deno.land/x/oak/mod.ts" ; import { Employee } from "../models/employee.ts" ; import employeeService from "../services/employeeService.ts" ; const { cwd } = Deno; class Controller { static async hello(ctx: any ) {

#Deno 页面渲染# 视频讲解 https://www.bilibili.com/video/BV1BT4y1E7Nh/?p=2 我们一起来完成以下步骤: [X] 1. 首先来了解一下支持页面渲染都有哪些组件: NO Name Star A Denjucks 13 B Ejs 4.5K C Handlebars 15.4K 我们今天要学Ejs模板引擎入门。其他两个如法炮制 [X] 2. 创建Controller [X] 3. 创建Router [X] 3. 创建页面index.ejs [x] 4. 创建主应用文件main.ts [X] 5. 测试 #controllers/controller.ts const { cwd } = Deno; class Controller { static async getData(ctx: any){ //cwd获取当前工程目录 //注意 ' ！== ` ctx.render( ` ${cwd()} /views/index.ejs` ,{ title : "Testing" , data :{ name : "deepincoding.com" } }); } } export default Controller; #routers/index.ts import { Router } from "https://deno.land