Nginx がフロントエンドの静的 Web サイトを展開する詳細な教育 (ステップバイステップ)

序文

Xshell、Xftp、Nginx を使用して静的 Web サイトを最初から簡単に展開するには、クラウドサーバー (Alibaba Cloud、Tencent Cloud、Huawei Cloud など) が必要です。

1.XshellとXftpをダウンロードしてインストールします。

XSShellはコマンドラインからサーバーを操作するために使用され、Xftpはサーバーへのファイルのアップロードおよびダウンロードに使用されます。

公式ダウンロードリンク: NetSarang ホームページ CN - NetSarang Website

ページの下部にある無料版を選択します

正しい名前とメールアドレスを記入し、メールが届いたらフリーソフトをダウンロードしてインストールすれば次へ進めばOKです。

2. 新しいセッション接続サーバーを作成します

手順: Xshell を開いて新しいセッションリンクを作成 --> サーバー名を入力 (カスタマイズ可能) --> ホスト IP アドレス (サーバーのパブリックネットワーク IP) を入力 --> ポート番号 --> デフォルトのその他のコンテンツ --> [OK] をクリックします

コマンドを入力して、接続が成功したかどうかを確認します。

cd /
ll
或
ping baidu.com
都可以访问，即连接成功 ！

図に示すように:

3. Nginxサーバー

Nginx公式サイト：

①yumの依存関係をインストールする

yum install yum-utils

②yumソースファイルを追加

cd /etc/yum.repos.d/
# 添加nginx的yum源码
vim nginx.repo

# 或 直接新建 nginx.repo 文件
vim /etc/yum.repos.d/nginx.repo

# 按下键盘中 “i” 键 进入编辑状态

③nginx.repoファイルに設定情報を追加

[nginx-stable]
name=nginx stable repo
baseurl=http://nginx.org/packages/centos/$releasever/$basearch/
gpgcheck=1
enabled=1
gpgkey=https://nginx.org/keys/nginx_signing.key
module_hotfixes=true

[nginx-mainline]
name=nginx mainline repo
baseurl=http://nginx.org/packages/mainline/centos/$releasever/$basearch/
gpgcheck=1
enabled=0
gpgkey=https://nginx.org/keys/nginx_signing.key
module_hotfixes=true

保存してescで終了

:wq

④Nginxをインストールする

yum install -y nginx
# yum install nginx
# 如果使用yum install xxxx，会找到安装包之后，询问你Is this OK[y/d/N]，需要你手动进行选择。
# 但是如果加上参数-y，就会自动选择y，不需要你再手动选择！

⑤Nginxのバージョン番号を確認する

nginx -v
# 显示nginx的版本号和编译信息

⑥インストールされているすべてのNginxパッケージを表示する

yum list | grep nginx

⑦ Nginx インストールに関連するファイルの場所情報を表示します。

whereis nginx

Nginxのディレクトリ構造

# Nginx终端管理理命令
/usr/sbin/
# 启动 Nginx
/usr/sbin/nginx

# Nginx 配置
/etc/nginx
/etc/nginx/nginx.conf
/etc/nginx/conf.d
/etc/nginx/conf.d/default.conf

# Nginx模块⽬录
/usr/lib64/nginx

# 默认站点目录
/usr/share/nginx

4. Nginx 静的 Web サイトの展開

①Nginxデプロイメントの最初の体験として、Nginxのデフォルトサイトの静的ファイルディレクトリに直接入力し /usr/share/nginx/html 、独自のプロジェクトファイルをアップロードして基本的なテストデプロイメントが完了します。

# 查看nginx的文件位置
whereis nginx
# 进入nginx 默认站点静态文件目录
cd /usr/share/nginx/
ll
cd html
ll

②ログインリンクXftp

③プロジェクトのソースファイルをアップロードする

④ウェブサイトのソースファイルをアップロードしたら、ブラウザにサーバーipを入力してアクセス！