Why pay attention to the front Serverless?

Serverless concepts or scenarios that we've talked about a lot, there will not be repeatedly described. General speaking - connotation Serverless is for all the underlying resource and packaging operation and maintenance work, allowing developers to focus more on business logic. (Author @Aceyclee )

Complete the basis of these two articles Recommended reading:

This article from the angle of a circle, more ways to earth talk Serverless.

Talk about a story, work from home during the epidemic, we certainly did little to cook your own meals they realized housework is not easy, you need: to buy food to buy pot, food processing, fry cooking, washing dishes last.

It does not sound quite like software development? You need to have a cloud server, back-end development, front-end development, as well as operation and maintenance.

You think, if I could only turn two under shovel, then you can eat that nice.

Coincidence, there are some businesses to provide this service to help you ready for the pot, clean ingredients, pointing professional chef, you just turn into a shovel or two, you can cook a gourmet meals! And do the dishes.

Corresponds to software developers, developers only need to focus on the business logic (cooking), while the underlying resource and operation and maintenance (pots and pans, food processing) do not have to worry about.

And finally to the formal resumption of the time, you do not have to cook for yourself, buy a new kitchen on idle. You recall the wonderful experience in the commercial district, the home also can be used if the kitchen when paid yesterday, do not charge more than good.

Hey, Serverless also the case, according to Hydro-like billing function only when deployed on its operating charges.

So back to the title, Serverless cloud computing technology itself is not front-end technology, why pay attention to the front Serverless it?

The answer is simple - the liberation of the productive forces.

Your kitchen is ready to deal with all kitchen utensils and good ingredients, you now only need to be concerned about serious heat cooking, become food bloggers around the corner. Wen said that is the first - developers can focus more on business logic, and other resources of the underlying operation and maintenance work have all been good package.


▎Talk is cheap, show you the code.

Give everyone present a document based on Serverless docsify build the demo

The three-minute demo, not only to complete the upload docsify release code also includes applications and configuration Tencent cloud object storage COS resources. And this is just my first time to build applications using the Serverless, high visibility of it to get started.

Original link: "three minutes into the pit refers to the North Docsify + Serverless Framework to quickly create a personal blog."

Further, we demonstrate a Fullstack Application. The project With existing community @ serverless / tencent-express and @ serverless / tencent-website components to complete.

The following is a simple assembly of FIG dependency:

Component Dependency Structure

Before starting all the steps required to execute npm install -g serverlessthe command, global installation serverless cli.

1. Prepare

New project directory fullstack-application-vue, in this new project directory apiand dashboarddirectory. Then add serverless.ymland .envconfiguration files, project directory structure is as follows:

├── README.md       // 项目说明文档
├── api                   // Restful api 后端服务
├── dashboard           // 前端页面
├── .env                    // 腾讯云相关鉴权参数:TENCENT_APP_ID,TENCENT_SECRET_ID,TENCENT_SECRET_KEY
└── serverless.yml  // serverless 文件

2. The development of back-end services

Enter the directory api, add app.jsfiles, write expressservice code, where the first to add a route /, and returns the current server time:

const express = require('express')
const cors = require('cors')
const app = express()

app.use(cors())
app.get('/', (req, res) => {
  res.send(JSON.stringfy({ message: `Server time: ${new Date().toString()}` }))
})
module.exports = app

3. Development front page

This case is the use of Vue.js+ Parcelfront-end template, of course you can use any of the front end of the scaffolding projects, such as Vue.js official recommended Vue CLI generated by the project. Enter the dashboarddirectory, write an entry file src/index.js:

// 这里初始是没有 env.js 模块的,第一次部署后会自动生成
require('../env')

const Vue = require('vue')

module.exports = new Vue({
  el: '#root',
  data: {
    message: 'Click me!',
    isVisible: true,
  },
  methods: {
    async queryServer() {
      const response = await fetch(window.env.apiUrl)
      const result = await response.json()
      this.message = result.message
    },
  },
})

3. Configuration

Front and rear side code are ready, and then a simple configuration serverless.ymlfiles:

name: fullstack-application-vue

frontend:
  component: '@serverless/tencent-website'
  # inputs 为 @serverless/tencent-website 组件的输入
  # 具体配置说明参考:https://github.com/serverless-components/tencent-website/blob/master/docs/configure.md
  inputs:
    code:
      src: dist
      root: frontend
      hook: npm run build
    env:
      # 下面的 API服务部署后,获取对应的 api 请求路径
      apiUrl: ${api.url}

api:
  component: '@serverless/tencent-express'
  # inputs 为 @serverless/tencent-express 组件的输入
  # 具体配置说明参考:https://github.com/serverless-components/tencent-express/blob/master/docs/configure.md
  inputs:
    code: ./api
    functionName: fullstack-vue-api
    apigatewayConf:
      protocol: https

4. Deploy

When deployed, simply run the serverlesscommand on the line, of course, if you need to see the deployment of DEBUGinformation, but also need to add --debugparameters, as follows:

$ serverless
# or
$ serverless --debug

Finally, the terminal will balabalabala~see the green doneline.

Experience: Online Demo

Since it is a full-stack, how little had read the database it?

Readers of the original venue Continue reading: "full stack Serverless Component-based solutions"

From these two small projects already have solutions - Serverless connotation is that of all the underlying resource and packaging operation and maintenance work, allowing developers to focus more on business logic.


▎ written on the back

Questions of the main problems in the description of valuable, in fact, really is not a concept Serverless front end, not even to solve the problem of the emergence of the front end, it is actually the development of cloud computing necessary process.

Like, the development trend of the underlying language is definitely high-level language. The high-level language will surely package from the underlying hardware, the programmer need not be concerned about the state of the hardware, focus on coding.

Ten years ago, a senior programming is quite difficult subject, and now elementary programming courses have been carried out. In fact, because the development of programming languages, so that programming has become more friendly.

Similarly, Serverless the emergence and improvement, which is a software development becomes more friendly. Not only need to focus on front-end Serverless, it may belong to every type of application developers.

This will eliminate the back-end it? And will not!

It will be more focused on the back-end business logic, something more specialized data processing, algorithm strategies.

Let advent of the automobile has become a coachman driver, change in technology, engineers will also grow.


Portal:

Welcome: Serverless Chinese network , you can best practice experience to develop more applications on Serverless in!


Recommended reading: "Serverless architecture: from principle, designed to project combat."

Guess you like

Origin www.cnblogs.com/serverlesscloud/p/12532780.html