从静态页面设计到Nginx网站部署(走过路过，千万不要错过!!!)

文章目录

一、静态页面设计

目录结构
最后的效果图（推荐使用 chrome，Firefox 浏览器）
① 个人介绍网页 (index.html)
② 404页面(404.html)
说明
网页设计代码已托管到 gitee，?：摸鱼怪的个人简介
所以这里就不再粘贴出代码了。后面的从 Nginx 的安装到网站的部署，所用的网页将会以此为模板进行搭建，到时只需克隆一份到本地即可，所以请看下面的操纵
在这里再附上一个?，可以提前预览预览：在下摸鱼怪

二、安装 Nginx

环境说明
① 系统：Ubuntu
② 浏览器：推荐使用 chrome 或 Firefox
更新源
```
sudo apt-get update
```

安装依赖库

sudo apt-get install build-essential libtool openssl libpcre3 libpcre3-dev zlib1g-dev

下载nginx

wget http://nginx.org/download/nginx-1.14.2.tar.gz

解压并进入该目录

tar -zxvf nginx-1.14.2.tar.gz
cd nginx-1.14.2/

将 nginx 安装到 /usr/local/nginx 目录
```
./configure --prefix=/usr/local/nginx
```
切换到 root 用户
```
su
```
编译，安装
```
make install
```

三、测试运行 Nginx

执行启动命令
```
/usr/local/nginx/sbin/nginx 
```
查看是否有 nginx 进程，如果有，则说明成功
```
ps -ef | grep nginx
```
打开浏览器输入 localhost，效果如下

四、Nginx 常用命令

启动服务
```
/usr/local/nginx/sbin/nginx 
```
停止服务
```
/usr/local/nginx/sbin/nginx  -s stop
```
重新加载配置
```
/usr/local/nginx/sbin/nginx  -s reload
```
测试配置文件是否正确
```
/usr/local/nginx/sbin/nginx -t
```
如果需要修改 Nginx服务配置，请参考?中的第三个链接

五、配置个人介绍网页

还是在 root 用户下操作

进入 nginx 的安装目录，删除默认的 html 文件
```
cd /usr/local/nginx
rm -rf html
```
git clone 个人介绍网站
如果没有安装 git，请先安装 git，apt-get install git
```
git clone https://gitee.com/xwmrcj/introduction.git
```
将下载文件重命名
```
mv introduction/ html
```
重新加载配置
```
/usr/local/nginx/sbin/nginx  -s reload
```
然后刷新浏览器，效果如下
OK！到这一步就说明用 Nginx 完成一个简单web网站就算成功了，剩下的就是修改修改前端样式，换成自己喜欢的即可。

六、参考?：

版权声明：本文为xwmrqqq原创文章，遵循CC 4.0 BY-SA版权协议，转载请附上原文出处链接和本声明。

原文链接：https://blog.csdn.net/xwmrqqq/article/details/110309518