nginx搭建静态服务器

如何将自己写的前端静态页面部署到自己服务器

一、购买属于自己的服务器和域名

1、百度搜索腾讯云或者阿里云，对于新人来说一般都有很大优惠的，活动一直都有，新人还有免费试用的。

下面以腾讯云为例，选择云服务器和域名，选择购买。反正就是买这两个（域名可以选择购买，反正也不贵），直接买会云服务器比较贵，但是活动一直都有，优惠力度很大，能白嫖就白嫖。

二、连接自己服务器

1、下载xshell6和Xftp 6

我在这也提供下载链接，如果失效了，可以直接去百度上搜索，下载很方便的。

百度网盘：https://pan.baidu.com/s/1z1Yz5YWCSx2yazhjmhltYQ

提取码：oi37

2、购买后会给你IP地址和密码，没有密码自己直接改一下就行了

3、登录时候输入IP，公网IP，密码后就可以链接自己服务器了

4、链接成功

三、安装yum, yum是Linux系统的安装必备神器，简直不要太方便。但是新系统一般是不自带yum工具的，所以需要手动安装一下。

1. 新建一个目录用来保存yum安装包

mkdir install

2. 进入文件夹并输入命令

wget http://yum.baseurl.org/download/3.2/yum-3.2.28.tar.gz

3. 解压

tar -xvf yum-3.2.28.tar.gz

重点：解压后先不着急安装，手动创建一个yum的conf文件

touch /etc/yum.conf

4. 进入yum目录，脚本安装

cd yum-3.2.28　　

./yummain.py install yum

期间会提示安装新版本，y回车即可

5.安装成功！

四、安装nginx

1.在 CentOS 上，可直接使用 yum 来安装 Nginx

yum install nginx -y

安装完成后，使用 nginx 命令启动 Nginx：

2.nginx

此时，访问公网ip 可以看到 Nginx 的测试页面, 下图:

如果无法访问，请重试用 nginx -s reload 命令重启 Nginx

五、配置静态服务器访问路径

1.外网用户访问服务器的 Web 服务由 Nginx 提供，Nginx 需要配置静态资源的路径信息才能通过 url 正确访问到服务器上的静态资源。

打开 Nginx 的默认配置文件 /etc/nginx/nginx.conf ，这里可以用xftp-6打开，右键选择记事本打开

2.修改 Nginx 配置，将默认的 root /usr/share/nginx/html; 修改为: root /data/www;，如下：

记得保存一下！！！

六、部署自己的网页

1、把自己写的HTML文件拖到data/www文件下就可以了，HTML主页名称是index，这样输入公网IP就可以直接访问自己的网页了

2、IP记不住太麻烦，之前说选择购买一个域名

可以直接在腾讯网上解析到自己服务器，这样就可以输入域名直接访问了

解析输入公网IP就行了，腾讯，阿里云官网都很人性化，都会默认帮你填好，教你怎么填

3、体验一下

输入自己的域名，浏览自己写的网页，我这个写的是移动端上的网页，想让自己网页变得华丽一些？网上一堆模板，直接套用就行了

结语：创作不易，麻烦收藏和关注一下！！&( ^___^ )

（即是对作者的支持，也方便自己以后查找，感谢收藏和关注）

以后也会持续更新工作学习中的技术、经验

其它相关文章：

App Store 上架流程

利用NVM管理node.js版本

使用Nginx部署前端页面相关推荐

k8s安装nginx部署前端页面_Kubernetes之使用Kubernetes部署Nginx服务
使用k8s部署Nginx服务,Nginx对外提供服务只希望部署在其中一台主机,该主机不提供其他服务一.设置标签及污点为了保证nginx之能分配到nginx服务器需要设置标签和污点,设置标签可以让P ...
k8s安装nginx部署前端页面_怎么在k8s中部署nginx？
apiVersion: v1 kind: Namespace metadata: name: shujubu labels: name: shujubu 执行文件创建 shujubu命名空间: kub ...
k8s安装nginx部署前端页面_Kubernetes(k8s)部署并测试nginx service
创建2个pod的nginx service [root@node1 data]# kubectl run nginx –replicas=2 –labels="run=load-balanc ...
nginx 部署前端vue项目dist文件
nginx 部署前端页面 server {listen 8082; server_name localhost;location / {root /usr/local/dist; #前端页面地址ind ...
nginx 部署前端项目，不缓存html文件，项目发版后，不用手动刷新页面
nginx 部署前端项目,不缓存html文件,项目发版后,不用手动刷新页面 location / {expires 1h;root /home/test/vue/dist/;index index.h ...
踩坑：云服务器Nginx部署前端遇到http与https问题
问题:nginx部署前端项目,修改配置文件路径后,页面一直无法加载css.js.img 解决:看了一堆博客都没有解决,最后是发现https访问的css.js等资源导致. 解决方案1::如果没理解错的话 ...
Nginx部署单页面应用如何进行配置
Nginx部署单页面应用如何进行配置在前后分离的项目中,通常部署的时候也会分开部署,这样便于管理.前端项目一般使用angular,vue或者react来编写,使用build命名来编译,编译之后就是只 ...
win10 nginx部署前端项目（静态资源服务器和HTML）
win10 nginx部署前端项目(静态资源服务器和HTML) niginx的安装和启停操作参照博客:https://blog.csdn.net/qq_26666947/article/details ...
docker使用nginx配置前端页面
docker使用nginx配置前端页面 1.拉取镜像 docker pull nginx:latest 2. 启动容器 $ docker run -itd --name test-nginx -p 2 ...

使用Nginx部署前端页面

nginx搭建静态服务器

一、购买属于自己的服务器和域名

二、连接自己服务器

三、安装yum, yum是Linux系统的安装必备神器，简直不要太方便。但是新系统一般是不自带yum工具的，所以需要手动安装一下。

四、安装nginx

五、配置静态服务器访问路径

六、部署自己的网页

其它相关文章：

使用Nginx部署前端页面相关推荐

最新文章

热门文章

使用Nginx部署前端页面

nginx搭建静态服务器

一、购买属于自己的服务器和域名

二、连接自己服务器

三、安装yum, yum是Linux系统的安装必备神器，简直不要太方便。但是新系统一般是不自带yum工具的，所以需要手动安装一下。

四、安装nginx

五、 配置静态服务器访问路径

六、部署自己的网页

其它相关文章：

使用Nginx部署前端页面相关推荐

最新文章

热门文章

五、配置静态服务器访问路径