前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >如何制作网站,个人向腾讯云网站搭建教程

如何制作网站,个人向腾讯云网站搭建教程

原创
作者头像
风烛夜
修改2022-04-06 12:32:06
26.2K1
修改2022-04-06 12:32:06
举报
文章被收录于专栏:云服务器使用教程

如何制作网站,个人向腾讯云网站搭建教程。想要制作一个网站,我们需要准备两样东西域名和服务器,其中域名是我们访问网站依据,例如我们现在所熟知的baidu.com,它的作用和门牌号类似,我们不需要知道房子在世界上的具体经纬度,只需要根据门牌号就能够一步步找到具体的房子。同样的,我们不需要知道百度这个网站对应的ip地址,只需要知道域名就能找到百度这网站。而服务器则可以看作是存放一台存放网站内容的电脑,我们访问网站的过程看作是将服务器的网站内容下载到本地并在浏览器上显示的过程。

1. 制作网站前的准备

1.1 制作网站需要注意的问题

正如文章开头所说的那样,我们想要搭建网站首先要准备两样东西域名和服务器。不过在购买域名和服务器之前我们需要注意以下几个问题。前往购买服务器

  • 如果服务器位于中国大陆,那么我们必须对域名进行备案才能够将域名解析到服务器。(解析就是将域名和服务器进行关联,只有将域名解析到服务器后,浏览器才能够知道将访问这个域名的请求转到网络上的哪台服务器)
  • 如果服务器不是位于中国大陆,那么网站建立后的访问速度肯定会比位于中国大陆的服务器慢。(网站访问速度慢可能会影响搜索引擎的收录和排名)
  • 如果我们的网站没有备案,那么我们就无法使用国内cdn加速器。(cdn加速可以提升网站的访问速度,而国外的cdn因为他们的加速节点在国外,因此大都不能提升我们的网站在国内的访问速度。)
  • 我们选择的域名最好与我们网站的内容有关联。例如我们的网站是“火狐”,那么我们可以选择域名firefox.com
  • 购买域名时最好选择.com为后缀的域名,这个域名使用范围最为广泛。虽然也有其他后缀的顶级域名,但这些域名如.top并不如.com应用广泛。

1.2 购买服务器和域名

购买腾讯云服务器,购买域名

点击上方的链接,选择合适的服务器购买完成后。再次点击上方的链接并选择步骤一中的控制台。随后在步骤二左上角的“云产品”中输入“域名注册”。并在步骤三跳出的页面中选择“注册域名”,选择你想要使用的域名。当域名购买完成后,等待一会后再进入步骤三的页面,可以看到域名已经显示在步骤三对于的图片中。

步骤一:

如何制作网站
如何制作网站

步骤二:

如何制作个人网站
如何制作个人网站

步骤三:

腾讯云如何搭建网站
腾讯云如何搭建网站

1.3 将域名解析到服务器

在上方步骤二左上角的“云产品”中输入“轻量应用服务器”并点击,这时我们可以看到步骤四中购买服务器所在的公网ip地址。我们只需要将域名解析到这个地址就可以完成域名的解析。再次进入步骤三并点击右侧的“解析”,进入步骤五域名解析页面。最后选择添加记录,主机记录填写www,记录类型选择A,记录值填写步骤四中的ip地址,即可完成解析。

步骤四:

腾讯云如何搭建个人网站
腾讯云如何搭建个人网站

步骤五:

网站制作教程
网站制作教程

1.4 网站搭建时域名的一些问题(可忽略)

以我们时常访问的百度为例,实际上我们是通过https://www.baidu.com/这个网址来访问百度的。其中.com是顶级域名,而我们购买的域名一般都是二级域名如:baidu.com这种。而www.baidu.com则属于三级域名,我们购买了二级域名后,同时拥有了对应的三级,四级甚至更高级域名的所有权,因此我们不仅可以将www.baidu.com解析到服务器,也可以将baijiahao.baidu.com甚至是bilibili.baidu.com解析到服务器。当然现在大多数网站使用的还是www.baidu.com这种三级域名来访问网站的,因此还是推荐和其他网站保持一致。

2. 开始制作网站

2.1 重装系统并设置远程连接密码

按照之前的流程进入到步骤四页面,并点击服务器进入步骤六详情页面,随后点击“重装系统”,进入步骤七页面,并选择官方镜像,系统镜像,centos8.0,随后点击确定并等待系统重装完成。重装系统完成后点击步骤六对应页面中右上方的”重置密码“设置远程连接的密码。随后点击步骤六对应图片中左上方的防火墙,并点击“添加规则”,将应用类型设置为ALL,这条规则只需要在远程连接时打开,当远程结束时可以将这条规则删除,等到需要时再次添加。

步骤六:

网站搭建教程
网站搭建教程

步骤七:

如何制作网站
如何制作网站

步骤八:

如何搭建网站
如何搭建网站

2.2 完成最简网站的搭建

链接:https://pan.baidu.com/s/1MsaugTRmtuxTsDFHzDpBUA 提取码:ewkq

  • 下载链接中的远程工具putty-64bit-0.76-installer.msi和WinSCP-5.17.10-Setup.exe并分别完成安装。
  • 安装完成后打开winscp软件,并点击”新建会话“、”新建站点“。
  • 填写条件并登录,其中文件协议选择SFTP协议、端口号填22、用户名填root、密码填之前重置密码时设置的密码。
  • 服务器连接后,步骤九中1对应的图标变为可点击状态,点击它并在步骤十中再次输入密码,最后按下enter键,注意,这里输入的密码不会显示在弹出的弹窗中。
  • 输入命令yum install nginx -y并按下enter键。这个命令是让服务器安装nginx程序用的。
  • 最后执行命令systemctl start nginx命令,这个命令是用来启动nginx程序用的。就像我们在windows上双击打开某个程序一样。
  • nginx启动后我们就可以通过ip地址或域名来访问我们的网站了,此时网站的内容实际上是有nginx这个服务提供的。

步骤九:

如何制作个人网站
如何制作个人网站

步骤十

如何搭建个人网站
如何搭建个人网站

2.3 给网站加上https

当我们在上一个步骤使用域名访问网站时会发现浏览器的左上角会提升“不安全”字样,这是因为我们当前使用的是http协议,只有使用了https协议浏览器才不会出现上述“不安全”字样。

  • 执行systemctl stop nginx命令,这个是为了停止nginx服务
  • 执行yum install -y certbot命令,给网站添加https需要先申请证书,这个命令是安装申请证书的程序,使用这个程序申请的证书有效期为三个月,到期后需要重新申请。
  • 执行certbot certonly --standalone --email 邮箱 --agree-tos -d www.你自己的域名 命令,使用这个命令申请证书(如果需要输入yes/no那么输入y就可以了)
  • 打开/etc/nginx/nginx.conf文件,在36行的下面添加下面代码块中的代码。
  • 在/var目录创建zzz文件夹并将自己写的index.html放到/var/zzz目录。
  • 最后执行命令systemctl restart nginx命令,这个是用来重启nginx服务的。这时我们可以看到网站不会再显示“不安全”字样了。
  • 第一个server框中的代码的含义:nginx服务会监听server_name对应的域名下来自80端口的请求(http请求),并将这个请求重写到443端口(https请求)
  • 第二个server框中ssl_certificate、ssl_certificate_key、ssl_certificate_key是用来配置https协议的。
  • 最后location对应的值说明server_name对应域名下所有来自443端口的请求,都会转到/var/zzz这个目录,其中网站首页对应/var/zzz文件夹的index.html这个文件。
代码语言:javascript
复制
    server {
        listen       80;
        server_name  你自己的域名;
        rewrite ^(.*)$ https://你自己的域名$1 permanent;
    }

    server {
        listen 443 ssl;
        server_name 你自己的域名; 
        ssl_certificate /etc/letsencrypt/live/你自己的域名/fullchain.pem;     
        ssl_certificate_key /etc/letsencrypt/live/你自己的域名/privkey.pem;
        ssl_trusted_certificate /etc/letsencrypt/live/你自己的域名/chain.pem;
        location / {
                root        /var/zzz;
                index       index.html;
        }
    }

2.4 如何制作网站(hexo)

链接:https://pan.baidu.com/s/1MsaugTRmtuxTsDFHzDpBUA 提取码:ewkq

  • 下载链接中的工具Git-2.31.1-64-bit.exe和node-v14.17.0-x64.msi并分别完成安装。
  • 右击鼠标选择Git Bash Here并在弹出的窗口中输入node -v和npm -v后页面会有对应的数字显示
  • 在git窗口输入npm install -g hexo-cli命令并按下enter键执行,安装hexo
  • 在git窗口输入hexo init hexoBlog命令并按下enter键执行,在桌面生成hexoBlog文件夹
  • 在git窗口输入cd hexoBlog命令并按下enter键执行,进入hexo文件夹
  • 在git窗口输入npm install命令并按下enter键执行,生成网站模板
  • 在git窗口输入hexo server命令并按下enter键执行,在本地运行网站
  • 这时可以通过http://localhost:4000/来访问已经部署的网站
  • 同时按下ctrl c键,终止程序运行,输入命令hexo generate生成可以部署到服务器的文件
  • 最后将hexoBlog文件夹中public文件夹内所有的文件都复制到服务器的/var/zzz目录就可以完成服务的部署
  • 其他会用到的hexo命令:hexo clean清除生成的public文件夹,hexo new hello生成名为hello的网页
  • 网页内容可以在hexoBlog/source/_post目录下对应的文件中修改,修改格式可参照markdown语法

2.5 搭建网站主题和修改网站访问路径

  • 在git窗口输入npm install hexo-renderer-pug hexo-renderer-stylus --save命令并按下enter键执行,安装渲染器
  • 在git窗口输入git clone -b dev https://github.com/jerryc127/hexo-theme-butterfly.git themes/butterfly命令并按下enter键执行,下载主题,butterfly
  • 将hexoBlog目录下_config.yml文件中theme对应的值替换为想要使用的主题名称
  • 再次执行命令hexo generate并将生成的文件放置到服务器对应的目录中
  • 将hexoBlog目录下_config.yml文件中permalink: :year/:month/:day/:title/替换为:title.html或/articles/:title.html来设置网页访问路径

怎么制作个人网站
怎么制作个人网站

原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。

如有侵权,请联系 cloudcommunity@tencent.com 删除。

原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。

如有侵权,请联系 cloudcommunity@tencent.com 删除。

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 1. 制作网站前的准备
    • 1.1 制作网站需要注意的问题
      • 1.2 购买服务器和域名
        • 1.3 将域名解析到服务器
          • 1.4 网站搭建时域名的一些问题(可忽略)
          • 2. 开始制作网站
            • 2.1 重装系统并设置远程连接密码
              • 2.2 完成最简网站的搭建
                • 2.3 给网站加上https
                  • 2.4 如何制作网站(hexo)
                    • 2.5 搭建网站主题和修改网站访问路径
                    相关产品与服务
                    网站建设
                    网站建设(Website Design Service,WDS),是帮助您快速搭建企业网站的服务。通过自助模板建站工具及专业设计服务,无需了解代码技术,即可自由拖拽模块,可视化完成网站管理。全功能管理后台操作方便,一次更新,数据多端同步,省时省心。使用网站建设服务,您无需维持技术和设计师团队,即可快速实现网站上线,达到企业数字化转型的目的。
                    领券
                    问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档