手把手教你从0搭建部署网站,保姆级教程(nginx部署及宝塔部署)

目录

简介

一、服务器

二、远程连接服务器

 三、nginx部署

1.安装配置

2.修改默认的访问页面

3.修改访问的配置文件

 四、宝塔部署


简介

文本主要介绍如何使用nginx 和 集成的宝塔面板二种方法 来部署上线网站,我用到的云服务器是腾讯云,当然其他的阿里云等服务器都是一样的,区别不大。

 需要用到的:

1.一台云服务器

2.Xshell软件(用来连接操作服务器)

3.Xftp软件(用来方便管理服务器中的文件)

一、服务器

首先我们要部署网站肯定得需要一台服务器,当然你的电脑也可以当成一台服务器,但是那样的话电脑就不能关机,得一直开着,所以我们购买一台轻量级的服务器即可,或者是免费领取一台服务器(可以领取体验的)

 购买完付款前应该会要你下载操作系统,我们直接下载centos即可,这个比较好用。

然后我们就可以进入到控制台

手把手教你从0搭建部署网站,保姆级教程(nginx部署及宝塔部署)_第1张图片

如果这里你下载错了操作系统,也没关系,我们直接重新装一个系统即可 ,跟着我的操作即可

手把手教你从0搭建部署网站,保姆级教程(nginx部署及宝塔部署)_第2张图片

 

 

手把手教你从0搭建部署网站,保姆级教程(nginx部署及宝塔部署)_第3张图片

 然后等他重装完就好了  接下来因为我们是第一次使用,所以我们需要重置用户名和密码,后续的连接服务器和登录服务器都需要用到

手把手教你从0搭建部署网站,保姆级教程(nginx部署及宝塔部署)_第4张图片

 手把手教你从0搭建部署网站,保姆级教程(nginx部署及宝塔部署)_第5张图片

 因为centos默认的用户名是root,可以选择改也可以不改,最好是改一下比较好

二、远程连接服务器

其实呢我们是可以直接在腾讯云中登录操作服务器的

手把手教你从0搭建部署网站,保姆级教程(nginx部署及宝塔部署)_第6张图片

 

手把手教你从0搭建部署网站,保姆级教程(nginx部署及宝塔部署)_第7张图片

 像这样输密码或者免密登录即可

然后我们就可以在里面输入一些linux命令操作服务器了

手把手教你从0搭建部署网站,保姆级教程(nginx部署及宝塔部署)_第8张图片

 但是这个我个人感觉不舒服,所以我推荐大家使用一个免费的软件来远程操作服务器,就是Xshell,他是完全免费的,下载地址:家庭/学校免费 - NetSarang Website (xshell.com)

手把手教你从0搭建部署网站,保姆级教程(nginx部署及宝塔部署)_第9张图片

 下载好之后安装即可,然后运行此软件

先新建一个连接

手把手教你从0搭建部署网站,保姆级教程(nginx部署及宝塔部署)_第10张图片

 

手把手教你从0搭建部署网站,保姆级教程(nginx部署及宝塔部署)_第11张图片

 输入用户名,就是我们刚刚修改的用户名和密码,如果没有改那默认的就是root

手把手教你从0搭建部署网站,保姆级教程(nginx部署及宝塔部署)_第12张图片

 

手把手教你从0搭建部署网站,保姆级教程(nginx部署及宝塔部署)_第13张图片

 像这样子,我们就连接成功了

手把手教你从0搭建部署网站,保姆级教程(nginx部署及宝塔部署)_第14张图片

 三、nginx部署

1.安装配置

目前主流的用于部署web服务器的有nginx , apache等,我们这里就使用nginx来部署网站

首先我们需要安装nginx,直接输入下面的命令安装即可

yum install nginx

遇到需要确认的地方,输入 y 确认即可

手把手教你从0搭建部署网站,保姆级教程(nginx部署及宝塔部署)_第15张图片

 然后运行nginx

输入下面的命令即可运行

nginx

使用此命令可以查看nginx是否处于运行运行状态

ps -ef | grep nginx

手把手教你从0搭建部署网站,保姆级教程(nginx部署及宝塔部署)_第16张图片

 像这样就证明是正在运行中

 这样就是没有运行

当我们运行之后,可以直接在浏览器中访问公网ip,就可以看到nginx部署的默认页面了

2.修改默认的访问页面

我们可以使用此命令直接访问到默认的存放页面的地方

cd /usr/share/nginx/html

 这就是他的默认页面了

我们可以使用命令将其删除,然后讲我们的页面代码拖进来即可

rm -rf index.html

然后讲我们文件夹中的index.html文件拖进来即可,必须得是index.html的文件才行喔,其他的命名需要另外配置,我们直接按照默认的来比较好,然后就可以再次访问公网ip地址,就可以看到我们上传的页面了

手把手教你从0搭建部署网站,保姆级教程(nginx部署及宝塔部署)_第17张图片

 当然这种方法对于不熟悉Linux命令的人来说可能不够优雅,而且我们也不推荐随便删除其中的默认文件

接下来我给大家推荐一个可以直接操作服务器文件的软件:Xftp,他的下载地址及连接的方式和Xshell是一模一样的,连接好后可以看到如下界面

手把手教你从0搭建部署网站,保姆级教程(nginx部署及宝塔部署)_第18张图片

 这就是我们这台服务器中的文件,我们可以直接在这里进行删除文件,修改文件等操作

3.修改访问的配置文件

刚刚上面讲到了删除默认文件那种方法是不太合适的,所以我们可以修改nginx的配置文件,来设置它的访问路径

使用下面的命令进入到nginx配置文件中

cd /etc/nginx

然后运行下面的命令来修改配置文件

vim nginx.conf

在修改之前我们可以先把项目文件放置到文件夹中,我这里是将一个打包好的Vue3项目放入下面目录中的文件夹中

手把手教你从0搭建部署网站,保姆级教程(nginx部署及宝塔部署)_第19张图片

 接下来就是修改配置文件了,输入上方的命令

手把手教你从0搭建部署网站,保姆级教程(nginx部署及宝塔部署)_第20张图片

 我们只需要修改其中的访问目录即可

我们定位到需要修改的地方,然后按下插入键,就是键盘上的insert建,可能有些电脑键盘是简写,那就是ins

手把手教你从0搭建部署网站,保姆级教程(nginx部署及宝塔部署)_第21张图片

 只需要修改成存放index.html文件的那个目录即可,然后可以按下左上角的 Esc 键,然后输入下面的命令保存文件

:wq

手把手教你从0搭建部署网站,保姆级教程(nginx部署及宝塔部署)_第22张图片

 现在配置文件就修改好了,修改完配置文件后我们需要重新启动nginx

关闭nginx

nginx -s stop

然后可以查看nginx运行状态,接着再次运行nginx,然后访问公网ip,即可看到我们放入的项目页面了

手把手教你从0搭建部署网站,保姆级教程(nginx部署及宝塔部署)_第23张图片

 其他的登录页面也是可以正常使用的

手把手教你从0搭建部署网站,保姆级教程(nginx部署及宝塔部署)_第24张图片

 四、宝塔部署

我们前面的nginx部署虽然可以成功部署,但是其中涉及到很多的Linux的命令,这对于不太熟悉Linux的人来说还是挺麻烦的,所以宝塔就应运而生了,它就是一个工具,可以帮我们管理我们的服务器,并且它是图形化界面,更方便我们操作。

我们在Xshell中进行安装,根据自己的操作系统手把手教你从0搭建部署网站,保姆级教程(nginx部署及宝塔部署)_第25张图片 

 我们是centos,所以运行此行命令

yum install -y wget && wget -O install.sh https://download.bt.cn/install/install_6.0.sh && sh install.sh ed8484bec

遇到所有需要选择的地方直接选择 “y" 同意即可

手把手教你从0搭建部署网站,保姆级教程(nginx部署及宝塔部署)_第26张图片

 下载完之后,会给我们一个访问宝塔页面的地址和账号密码,我们可以将其保存,记下来

手把手教你从0搭建部署网站,保姆级教程(nginx部署及宝塔部署)_第27张图片

 然后就可以复制面板地址进行登录了,但是在这之前我们需要配置安全组,确保我们的服务器的防火墙是对此端口开放的,否则是无法访问的

手把手教你从0搭建部署网站,保姆级教程(nginx部署及宝塔部署)_第28张图片

手把手教你从0搭建部署网站,保姆级教程(nginx部署及宝塔部署)_第29张图片

 然后就可以进入此页面了

手把手教你从0搭建部署网站,保姆级教程(nginx部署及宝塔部署)_第30张图片

 填写它给我们的初始用户名和密码

手把手教你从0搭建部署网站,保姆级教程(nginx部署及宝塔部署)_第31张图片

 绑定手机号,如果没有的话,注册一个即可。

接着进入了宝塔页面,我们直接安装推荐的默认配置即可

手把手教你从0搭建部署网站,保姆级教程(nginx部署及宝塔部署)_第32张图片

 

手把手教你从0搭建部署网站,保姆级教程(nginx部署及宝塔部署)_第33张图片

 在安装期间我们可以先把原来的nginx部署的网页给关闭掉,直接关闭nginx就行,避免等会出现冲突,安装好后我们可以在设置中进行配置

手把手教你从0搭建部署网站,保姆级教程(nginx部署及宝塔部署)_第34张图片

 这里使用默认的即可,接下来进行网站中添加站点手把手教你从0搭建部署网站,保姆级教程(nginx部署及宝塔部署)_第35张图片

 

手把手教你从0搭建部署网站,保姆级教程(nginx部署及宝塔部署)_第36张图片

 提交后就可以访问对应的端口号就可以看到页面了,不过这个页面是默认的页面,我们需要将我们的项目文件添加进文件夹

手把手教你从0搭建部署网站,保姆级教程(nginx部署及宝塔部署)_第37张图片

 在文件中上传我们的文件

手把手教你从0搭建部署网站,保姆级教程(nginx部署及宝塔部署)_第38张图片

 在设置中修改页面的访问路径

手把手教你从0搭建部署网站,保姆级教程(nginx部署及宝塔部署)_第39张图片

手把手教你从0搭建部署网站,保姆级教程(nginx部署及宝塔部署)_第40张图片

 

 选择好index.html文件的目录

手把手教你从0搭建部署网站,保姆级教程(nginx部署及宝塔部署)_第41张图片

 

 再次访问ip地址,页面就部署完毕了

手把手教你从0搭建部署网站,保姆级教程(nginx部署及宝塔部署)_第42张图片

 下次我们需要操作服务器可以直接登录宝塔页面就行,不需要用Xshell来用linux命令进行操作了

如果有什么问题可以私信或者评论,尽可能的帮大家解惑!!!如果此文章对你有帮助,可以三连支持一下嘛

你可能感兴趣的:(nginx,腾讯云,服务器,nginx)