如何白嫖一个动态网站

本文涉及的产品
.cn 域名,1个 12个月
简介: 我们知道,想要搭建一个网站往往需要一下几个步骤: 域名注册 服务器购买、 数据库购买或部署、网站设计、 网站开发、网站备案 网站上线、本文将介绍如何用最小的成本和最短时间开发部署一个动态网站。

「这是我参与11月更文挑战的第6天,活动详情查看:2021最后一次更文挑战」。

前言

我们知道,想要搭建一个网站往往需要一下几个步骤:

  1. 域名注册
  2. 服务器购买
  3. 数据库购买或部署
  4. 网站设计
  5. 网站开发
  6. 网站备案
  7. 网站上线

在国内上线一个网站,域名还必须得备案,光是域名备案的话还的几个星期,整个流程下来,上线一个网站可能要个把月。若选择云服务器,各大云平台新用户首年还有优惠,次年想要续费得花上不小成本。本文将介绍如何用最小的成本和最短时间开发部署一个动态网站。

购买域名

免费的域名可以选择Freenom,当然也可以选择不用域名,如果选择 Vercel 部署会自动分配一个二级域名,也挺好用的。当然域名注册也很便宜,最低 1 元,我这边选择的是腾讯云,购买之后只需要实名认证(上传身份证等信息)就可以直接域名解析了。

网站设计

对于程序员来说,网站设计可能会困扰到大家,大家可以去dribbble站酷等网站搜索向要实现的 app,挑选一个好看的设计应用到自己的网站中。

dribbble 页面截图

如果你会 TailwindCSS 我推荐 VSCODE 安装 这个插件tailwind-snippets 可以快速帮我们来发出一个常用的代码片段,大家可以在 https://www.tailwindsnippets.ml/snippets 查看效果,快速实现我们的 html 页面

tailwind-snippets 预览

部署

Vercel

Next.js 开发商 Vercel 获得最近 1.5 亿美元 D 轮融资。Vercel 注册什么的我就不讲了,建议使用GitHub 登录, 点击new project创建一个项目,这个项目可以从自己的 GitHub 库导入或者选择 Vercel 给的模板,Vercel 给的模板(下图)首先也会导入进自己的 GitHub 库,总之要先把内容导入进 GitHub 库才行。

Vercel 支持的框架

Vercel 为个人用户提供了

  1. 自动 HTTPS/SSL
  2. 带宽 100 GB
  3. 并发构建,每天 10 万次调用
  4. Serverless Function

所以 Vercel 不光支持静态网站也支持 nodejs 动态网站,如果想要其他后端语言

可以选择 heroku

heroku

Heroku 是一个支持多种编程语言的云平台,并且提供了 Heroku PostgresHeroku RedisApache Kafka on Heroku

Heroku 支持的语言

Heroku 虽然提供了比较全面的编程语言和数据库支持,免费用户还支持

  1. 使用 Git 和 Docker 部署
  2. 自定义二级域名
  3. 容器编排
  4. 自动操作系统补丁

但 heroku 对国内用户支持不是很友好,第一点访问国内速度比不上 Vercel, 第二点 163 和 QQ 邮箱都不能注册,想要注册得要其他邮箱, 第三没有免费的 ssl。第四项目源代码只能有 500M。

数据库选择

MongoDB

选择 https://cloud.mongodb.com/

mongodb 首页截图

创建 database 的时候选择 free;

选择免费截图
地域可以选择日本或者新加坡。

接着创建一个用户
创建一个用户
密码是自动生成的,要把密码拷贝下来

接着要创建一个允许链接的 IP 地址

在 mongodb.com 设置允许链接的IP

这里选择任何地方可以链接

接下来选择 database 点击 connect

在 mongodb.com 选择开发语言

还可以选择开发语言
在 mongodb.com 查看密码

上面的password 要替换成刚才创建用户的随机生成的密码

mysql

mysql 可以选择https://planetscale.com/

在 planetscale.com 选择免费模式

针对免费用户可以:

  1. 每月 10GB 存储
  2. 每月 1 亿行读取
  3. 每月 1 千万次写
  4. 每个数据库 3 个分支
  5. 1,000 个链接
  6. 每日自动备份
  7. 社区支持

可以直接接使用 Github 登录,跟着引导直接到最后一步创建数据库,

在 planetscale.com 选择地域

地域选择就近新加坡或者日本。

在命令行选择 planetscale.com

可以在命令行中管理数据,点击上图中的按钮随机生成密码,密码要用户手动保存,后面登录将无法看到

域名解析

Vercel 绑定域名

腾讯云解析域名到 Vercel

绑定域名我就不多讲了吧,直接去自己的域名平台,cname 域名到 cname.vercel-dns.com,然后 Vercel 会自动帮你生成一个证书。

网站备案

这边介绍的方案都是服务都不是部署在大陆的,所以可以选择不用备案,但如果想要在大陆运营的话,海外的速度往往跟不上的,还是要选择大陆的服务器,备案必不可少,各大云服务厂商都提供了备案服务,按照要求填写网站信息即可。

如果你之前没买过【云服务器】 可以买一个 3 年 2 核 4G 的轻量应用服务器。

3 年 2 核 4G 的轻量应用服务器

如果是老用户切换成 QQ 登录也可以买。毕竟服务器在国内,白国外还是好快很多的。

我之前给我的博客备案的时候是 16 年,现在也不记得具体步骤。
只记得备案方会给你邮寄一个幕布,按要拍了照片邮寄回去即可。不是很复杂,就是时间久了点。
网站备案幕布拍照

最后

接下来就是网站运营了,需要给网站引流,带来更多精准用户,网站的价值才能发挥最大。推广主要渠道和方式有 SEO、SEM、新媒体、信息流广告等。至于怎么做网站推广又是另外一个大话题了。


以上就是本文全部内容,希望这篇文章对大家有所帮助,也可以参考我往期的文章或者在评论区交流你的想法和心得,欢迎一起探索前端。

本文首发掘金平台,来源小马博客

相关文章
|
JavaScript Java 程序员
闲话目前游戏服务器的开发
闲话目前游戏服务器的开发
|
编解码 Linux Windows
5款免费开源软件推荐,总有一款适合你
最近后台收到好多小伙伴的私信,今天继续推荐五款小工具,都是免费使用的,大家可以去试试看。
896 1
利用docsify搭建个人博客并免费上线,太好用了,必须分享一下!
利用docsify搭建个人博客并免费上线,太好用了,必须分享一下!
|
SQL 开发框架 搜索推荐
【建站系列教程】5、谈一谈网站的静态化
【建站系列教程】5、谈一谈网站的静态化
132 0
|
域名解析 Java 关系型数据库
学习心得-纯手工搭建web环境
初次使用阿里云服务器搭建web环境以及成品展示。
224 1
学习心得-纯手工搭建web环境
|
域名解析 运维
阿粉带你从零搭建一个属于自己的个人网站(上)
很多小伙伴私信我,问我怎么弄一个个人博客系统,之前其实也聊过,不过没关系,今天我们再来详细的说一说。 对于已经上线的项目,我们知道后期的迭代主要集中在线上发布这个环节,那么对于一个从零开发完的项目,到上线要经过哪些流程呢?
阿粉带你从零搭建一个属于自己的个人网站(上)
|
程序员
18款表白网站源码,搭建网站必备,总有一款适合你!
18款表白网站源码,搭建网站必备,总有一款适合你!
18款表白网站源码,搭建网站必备,总有一款适合你!
|
存储 缓存 JavaScript
【简历加分】hexo框架搭建个人博客站点,手把手教学。
作为应届毕业生或者1-3年工作经验的程序员拥有自己的个人博客站点,绝对是简历的加分项,然而学习的成本确实非常的低,只要几十分钟就能搭建好自己的个人博客。闲话不多说,下面我们就开始动手来搭...
257 0
|
Java 应用服务中间件 Linux
阿粉带你从零搭建一个属于自己的个人网站(下)
很多小伙伴私信我,问我怎么弄一个个人博客系统,之前其实也聊过,不过没关系,今天我们再来详细的说一说。 对于已经上线的项目,我们知道后期的迭代主要集中在线上发布这个环节,那么对于一个从零开发完的项目,到上线要经过哪些流程呢?
阿粉带你从零搭建一个属于自己的个人网站(下)
|
前端开发 搜索推荐 数据库
开发人员,怎能没有个人博客!前人所创经典Typecho!
开发人员,怎能没有个人博客!前人所创经典Typecho!
236 0
开发人员,怎能没有个人博客!前人所创经典Typecho!