如何做项目部署,让一个网站跑起来

如何做项目部署,让一个网站跑起来_第1张图片
qingchunwudi.jpeg

鉴于很多人问过我这个问题,为此特意写这篇文章。

通常,因为没有后台基础,往往项目部署对于很多前端工程师来讲既神秘,又难以捉摸。

本文以我的开源博客sinn为例,为你梳理一个web应用是如何跑起来的。

一,跑起一个web应用需要哪些准备

要跑起一个web应用,它通常需要以下几样东西:

  • 服务器
  • 编程语言环境
  • 应用程序
  • 应用依赖的工具

下面来说说它们各自的作用。

** 1,首先说说web服务器 **

任何应用程序都是基于操作系统运行起来的,web应用也不例外。

服务器通常包含了操作系统以及相关的服务,如网络服务,IP服务等等。对于web应用来说,web服务器的主要作用在于为web应用程序的运行提供操作系统环境以及服务。

目前服务器按操作系统可分为两大类,一类是window服务器,二是linux服务器。很显然,window服务器自带了window操作系统,linux服务器自带了linxu操作系统。

其中linux服务器应用最为广泛,而linux服务器的操作系统有好几种,主要有RHEL、CentOS、Debian、Ubuntu、Suse。其中用的最多的莫过于ubuntu和centos系统。
而window服务器则由于其糟糕的生态等原因而越来越不受欢迎。通常部署应用首推linux服务器。

因此,首先你需要一个linux服务器为应用程序提供操作系统运行环境和服务。

** 2,其次,编程语言环境 **

所谓编程语言环境,也就是nodejs, java, php等编程语言的运行环境。

应用程序是使用编程语言开发的,因此,应用程序的运行需要依赖于编程语言环境。

举个例子,要运行一个nodejs后台应用,就需要有nodejs运行环境。运行一个java后台应用,就需要有java运行环境。

有必须说明的是,一个网站的前台和后台的运行环境是不一样的。

前台的编程语言环境在客户端(浏览器),后台的编程语言环境在服务器端。

  • ** 前台 **
    前台主要是在客户端运行的,也就是在浏览器渲染的。前台的编程语言环境就是浏览器环境,这是因为前台的编程语言主要是html,css和js,而浏览器本身内置了对html,css和js的解析。也就是说,前台应用并不需要在服务器搭建编程语言环境。

  • ** 后台 **
    后台则不同,后台应用是在服务器端运行,但服务器通常不会集成编程语言环境,因此后台应用往往需要在服务器搭建自己的编程语言环境。如果是nodejs应用,就搭建nodejs运行环境,如果是php应用,就需要搭建php运行环境,等等。

因此,有了服务器之后,你就可以在服务器上搭建你的后台编程语言环境。

** 3,应用程序 **

有了服务器和编程语言环境后,就等于有了应用程序的运行基础。

这里所指的应用程序,是你基于某种编程语言开发出来的应用。比如一个基于nodejs开发的node后台应用。

** 4,依赖的工具 **

有了应用程序之后,还需要搭建一些这个应用程序所依赖的工具。

比如说,后台应用往往需要数据库来存储应用数据,比如mongodb,mysql等等。
而前台应用往往需要nginx来做静态资源服务,nginx也可用于做代理和接口转发。

这些都是应用程序运行所依赖的工具。

至此,服务器,编程语言环境,应用程序,依赖的工具都具备了,可以着手部署应用了。

二,前台部署与后台部署的不同

这里主要讲两点不同。

1,部署的方式不同。

** 前台 **

首先,前台所用的编程语言主要有html,css,js,前台代码主要生成一些静态资源文件,比如html文件,css文件,js文件等静态资源文件。

因此,前台应用的部署实际上就是静态资源的部署。

那么,如何在服务器上做静态资源部署呢?

首先,前台代码生成一些静态资源文件,比如html文件,css文件,js文件等静态资源文件。

然后把这些静态资源(前台代码)发布到服务器上的某个目录下,然后在服务器端用nginx,apache或tomcat等工具架起一层静态资源访问服务,指定当客户端(浏览器)根据域名访问时,访问这个静态资源目录下的入口文件,比如index.html。

入口文件往往加载了一些css文件,js文件,图片等静态资源文件,因此,当访问入口文件index.html时浏览器会根据入口文件里的引用去请求服务器静态资源目录下的css文件,js文件,图片等静态资源。

所以,当你打开一个网页的时候,通过控制台,你通常会看到下面这样的请求:

如何做项目部署,让一个网站跑起来_第2张图片
http://sinn.boyagirl.com/

如上图,当访问http://sinn.boyagirl.com的时候,实际上是浏览器请求了域名为sinn.boyagirl.com的服务器上某静态资源目录下的index.html文件并做渲染处理,在渲染时浏览器再根据index.html里面的引用去请求这个静态资源目录下的css,js,img等静态资源,并在浏览器渲染出来。

浏览器的请求分为两类,一类是静态资源请求,比如请求html,css,js,img等静态资源,其作用在于把应用前台UI渲染出来。另一类请求则是接口请求, 也就是请求后台接口,与后台应用进行数据交互,将请求的数据赋给UI。

以上就是前台部署和访问的全过程。

** 后台 **

后台应用是在服务器端运行的,因此首先需要在后端搭建该应用的编程语言环境。其次搭建该应用所依赖的工具,比如数据库,进程管理工具等等。

以sinn的后台sinn-server为例。这是一个基于nodejs开发后台应用,使用mongodb作为数据库。

因此,部署sinn-server,首先需要在服务器搭建nodejs运行环境。有了nodejs编程语言环境之后,还需要搭建mongodb数据库等依赖的工具。

2,部署工具不同

前台部署是静态资源部署,使用了nginx, apache,或者tomcat等工具。其中最常用的就是nginx。

后台部署需要搭建编程语言环境,如果是php,java等应用,通常也还需要使用apache/tomcat搭建相应的程序服务。除此之外,后台应用往往还依赖数据库,进程管理器等应用程序工具。

经过上面的分析之后呢,我们已经了解到了部署一个应用程序的过程。

你可能感兴趣的:(如何做项目部署,让一个网站跑起来)