百度360必应搜狗淘宝本站头条
当前位置:网站首页 > SEO教程 > 正文

网站建立实战案例(网站制作实例)

gaoyangw 2024-11-15 18:35 11 浏览 0 评论

开篇

为什么是个人网站?

一个是自己平时需要用,另一方面之前写过,也有一些经验和思考,如果写其它类型的网站,自己又要兼顾学习和使用新技术,可能会比较累。

所以就写个人网站吧,如果这个项目写完了,后面再考虑写个电商网站或者自己一些创意idea的flutter APP。

会用到哪些资源?

会用到一台阿里云的服务器,大概1核CPU, 1G, 1M的最小配置款。

域名也是在阿里云上万网申请和备案的。因为备案比较麻烦,所以我打算沿用自己之前的域名yasinshaw.com。因为开发过程还要继续使用自己的个人网站,所以www, admin,file这些二级域名不会动。新的应用在开发阶段会使用newPortal、newAdmin等带有new的二级域名。等开发完成后再切换过去。

存储会用OSS,因为需要CDN,特别是图片。之前用的七牛云的,感觉还不错,现在也打算继续沿用。

SSL证书,用阿里云和七牛的免费证书。缺点是必须一个二级域名就要申请一个证书,而且要每年更新一次。但优点是免费的,还是挺香的。

所以严格来说并不是真正的“从0到1”,云平台的一些资源还是会用现成的。这部分也不会单独写文章介绍,毕竟跟技术关系不大,去云平台花钱买资源,然后简单设置一下就行了。

会用到哪些技术?

前端

前端的话,会用「Vue3」了。但我也很久没有关注前端了,Vue3的一些新特性我也不是特别了解,只能一边做一边看看了。TypeScript其实比较纠结要不要用,因为目前感觉ES已经能够满足自己项目的需求了,且目前没有学习过TS,不知道有没有足够的时间去学习TS。不过TS是趋势,看情况是否使用吧。

UI库

UI库,之前用的是vuetify,感觉也挺不错的。但这次想尝试一下「拟物风格」,不知道vuetify支不支持。如果不支持的话,到时候再去搜一下有没有合适的UI库。

后端

后端主要用「Kotlin」,因为想学习一下这门语言,听说挺香的。结合最新版的SpringBoot。应该会用到DDD结合整洁架构,之前有写过一些文章,趁这次机会实践一下。不打算用SpringCloud,因为机器资源太少,项目也比较简单,目前也没有深入学习的打算,用不太上。

DB

DB还是用「MySQL」了。这块暂时没有特别的需求,也没有时间和精力去学习其它DB。等以后再说吧。

搜索

搜索还是用ElasticSearch,单机部署,加个中文分词插件。这块之前做过,有经验。

缓存

缓存目前的个人网站是用的Redis,但是目前来看其实用不上。就单机的情况,其实用「内存缓存」会更好一点。

容器

Docker会用。不过之前用Docker用得比较简单,是用命令手动去启动的一些服务或中间件。这次打算用上Dockerfile,结合CI来更好地做「DevOps」。不用用到K8s和ServiceMesh,因为没有必要……

项目会写多久?

这个真不太好估算。大概期望能够在年前完成目前已有的基本功能吧。尽量保证每天都写一点,但是如果要同时更新系列文章的话,可能会有点忙不过来,但肯定是会经常更新代码的。

这篇文章主要描述我要做的这个网站的功能,以及我对这些功能的拆分,然后使用事件风暴的方式,归纳出主要的领域模型和领域事件。

需求描述

整个网站应该分为管理端和门户端。管理端用于我自己在后台管理整个网站,包括发布文章、管理评论等等。管理端需要登录,但不需要做太复杂的权限管理,因为只有我一个用户。

门户端是给其它人用的,也就是大家现在看到的我的个人网站的样子,可以在上面看到我发布的文章,也可以对文章进行评论,对网站留言等等。

管理端

我用思维导图归纳了管理端的主要功能:

主要核心的还是文章。但我把标签和素材单独拿了出来,是想到以后网站可能会继续开发新的功能,比如类似于朋友圈、相册、电商等功能。那这样信息分类、文件素材等等能力其实是可以通用的。

除此之外,还对网站版本、公告、邮件订阅等等小功能也有一定的支持。

门户端

门户端会相对简单一些,因为很多东西都是只读的,少了很多操作。门户端全程是不需要登录的,包括留言操作。所以这里可能要注意一下安全性的问题,包括防刷和幂等。

在最初设计的时候,我认为有些文章可能是需要密码的,有些页面也可能是需要密码的,比如我们可以把求职简历放在上面。

事件风暴

我使用了事件风暴对整个需求进行了分析,试图寻找可以用于实现这些需求的领域模型、领域行为和领域事件。

我用三种颜色的便利贴来标识它们:

最终,我得到了下面9张图:

其中,页面配置是想把网站上的一些东西做成配置化的,包括一些页面的背景图和文案等,现在也实现了这个功能:

按道理说,标签、素材、密码其实也可以放在文章里面,成为文章这个聚合的一部分。但是这里单独拿了出来,是考虑到以后可能会有其它场景也会用到标签、素材、密码。

理论上来说,它们也可以成为单独的领域模型,对外提供服务。事实上很多公司也是这么做的,所谓业务中台,其实就是业务能力的复用。比如标签这个东西,它其实是一个信息管理的能力,既可以用在文章上,也可以用在商品上,还可以用在客户上。

但后来我想了一下,这样做是方便扩展了,但对于现在来说可能会加大开发成本。尤其是在找“标签”和“密码”的时候,我是非常纠结的。

于是,我砍掉了一些不那么核心的领域模型,更聚焦在核心的领域模型上面。最终剩下这么6个领域模型:

那标签和素材怎么办?

还是简单粗暴的处理方式,放在文章内部。因为其实现在也主要是文章会用到这两个东西,完全可以把它们作为文章这个领域模型的一个值对象。其实我现在线上这个版本也是这么做的:

当然了,从实现上来讲,可能底层的存储会和现在的实现有些不一样,因为之前就是在信息分类这块没做好,所以产生了“文集”、“主题”、“标签”等等一堆概念。但其实只需要标签就可以了,基于标签来做分类、搜索、推荐的功能。所以标签可能在DB层面是一个单独的表,但如何实现不是在这个阶段需要思考的,现在我们只需要关心领域模型就行了。

密码这个东西,现在看起来不是非要不可,而且想设计一个对多种资源加密的密码管理,开发成本较大,尤其是前端。所以我直接去掉了密码这个领域模型,也砍掉了与之相关的需求。以后如果有文章加密的需求,也可以作为文章的一个值对象来处理。

所谓DDD,最后一个D就是Design,没有绝对正确和标准的领域模型,只有合适的领域模型。设计总会有所权衡和取舍。在设计过程中,也会发现有些需求可能不合理或者实现成本比较大,可以做适当的调整。

没有再细分子域和限界上下文。因为目前来看,个人网站的功能还是比较简单的,没有必要再细分。真要细分的话,我觉得可以分为“文章域”、“网站管理域”和评论域,其中文章、订阅等属于文章域的,页面配置、公告、版本介绍等属于网站管理域。评论单独拿了出来,因为它是一个通用的子域,它既可以用于文章评论,也可以用于网站留言板。

为什么评论不拆开,一个是“文章评论”,一个是“留言板”?因为我认为两者其实是一个东西,都是用户在网站上留下一段话,也可以回复别人。只是评论的主体不同而已,一个是文章,一个是网站本身。所以我认为它是一个独立的领域模型。

整个网站的需求拆分、模型设计都已经搞好了,下一步需要做的就是开始搭建开发环境啦,敬请期待!

这篇文章主要介绍基于云服务器的生产环境的搭建,以及CI/CD等其它工具的搭建。

云服务器

要想做一个网站,首先你得有一台服务器。感谢我们来到了云时代,现在在云平台上搭建一台云服务器非常方便,不用自己去折腾硬件搭建一台服务器了。

我自己是用的阿里云。用什么平台取决于你自己喜好,以及去哪能薅到羊毛。AWS和GCP好像都是用信用卡可以薅,而国内的云平台一般是可以用学生身份比较便宜地薅到。偶尔也会搞双十一之类的活动,价格也比较便宜,一年就一两百块左右。

买云服务器要注意的主机所在的机房。国外或者香港地区所在的机房的服务器一般会贵一点,但是可以顺便搭个梯子自己用。国内的机房,尽量选自己的目标用户更近的机房,这样网络访问延迟能够稍微低一些。

个人网站的话,一般最低配置就行了。我的个人网站现在就是用的阿里云的1核2G,1M带宽的最低配版服务器。但低配的话,需要在性能上和开发过程中多下一些功夫。因为带宽低,前端资源需要尽量放在CDN加速;CPU和内存低,尽量使用本地机器来做CI/CD的runner机器。这些小技巧会在后面的文章慢慢介绍。

域名

云服务器给我们的是一个固定的公网IP。有了公网IP,别人就能够访问到我们的服务了。但是ip不太容易记,而且有些场景是需要域名的(比如做微信公众号的时候、使用HTTPS等),所以申请一个域名还是很有必要的。

域名申请比较简单,在很多云平台上也可以直接购买域名和配置ip到域名的映射关系。域名后缀无所谓,看自己喜欢。.com是用得最广泛、最多的。国内也有一些.com.cn,自己的个人网站的话,也可以使用.me.site等。一年大概几十块钱,首次购买一般有优惠。

但域名备案比较耗时,如果是国内申请的域名或者用了国内的服务器,就需要备案(在阿里云上买域名可以在上面直接上传资料备案),建议尽早申请。

安装docker

操作系统只要是Linux就行,具体哪个发行版影响不大。

服务器搞定后,先把自己本地ssh生成的公钥放到服务器的authorized_keys里面,方便以后可以不需要密码直接登录服务器

然后下载安装docker,推荐自带的yum/apt安装就行了,安装docker完成后,可以用启动一个nginx实例,在本地用浏览器,看能不能访问到。这里如果有域名的就可以配置一下域名了,看是否能正常解析。

sudo apt-get install docker

可以启动一个portainer,它是一个管理docker的web界面工具,轻量级。特别适合对docker命令不太熟悉或者不喜欢使用docker命令的同学。使用下面这个命令可以轻松创建一个portainer容器:

docker run -d -p 9000:9000 \
--privileged --restart=always \
-v /var/run/docker.sock:/var/run/docker.sock \
--name portainer portainer/portainer

安装gogs

gogs是一个代码托管平台,类似于Github、Gitlab等。但是Github网速较慢,而Gitlab比较耗资源,如果服务器资源很少的话,就不适合了。

gogs非常轻量,而且可以使用docker快速部署。

sudo docker run -d \
--name=gogs --restart=always \
-p 10022:22 -p 10080:3000 \
gogs/gogs

启动后,在浏览器访问服务器的10080端口,就可以打开gogs了,第一次打开需要进行初始化设置,这里注意端口和url的设置

安装完成后,去个人信息里面配置一下ssh的公钥,然后创建自己的项目,这个就不详细介绍了。

安装drone

drone是一个轻量级的CI/CD工具。使用docker可以快速部署一个drone服务,并自动与gogs连接:

它也可以支持Github、Gitlab、Gitea、Bitbucket等平台,需要在创建时传入不同的环境变量。具体用法可以参考官方文档:https://docs.drone.io/

docker run \
-e DRONE_AGENTS_ENABLED=true \
-e DRONE_GOGS_SERVER=http://yasinshaw.com:10080 \
-e DRONE_RPC_SECRET=your_drone_secret \
-e DRONE_SERVER_HOST=yasinshaw.com:20080 \
-e DRONE_SERVER_PROTO=http \
-e DRONE_USER_CREATE=username:yasin,admin:true \
-p 20080:80 \
-p 20443:443 \
--restart=always \
--detach=true \
--name=drone \
drone/drone:1

用浏览器打开服务器的20080端口,会出现一个登录界面。需要使用gogs的管理员账号密码登录

这里需要加上DRONE_USER_CREATE配置,username的值为你的管理员用户名,这样才能开启项目的Trusted Mode,才能在构建项目过程中挂主机的volume。具体参考:
https://docs.drone.io/quickstart/cli/#trusted-mode

登录以后,会自动同步gogs的项目,并且会在gogs那边自动创建一个webhook。

在我们的项目根目录创建一个.drone.yml文件,即可配置drone的CI/CD流程,然后提交代码就可以自动触发CI/CD了,是不是非常简单?

但是这个时候我们只有drone server,没有drone runner,所以触发后没有runner去执行任务,会一直卡在那。drone支持多种类型的runner,包括docker、ssh等。我们可以创建一个docker runner用来执行build等任务,创建一个ssh runner用来远程登录到我们的服务器重启部署服务。

我们可以在服务器或者我们本机创建runner。个人更推荐用本机的,因为服务器比较垃圾,本机资源更多。

 docker run -d \
 -e DRONE_RPC_PROTO=http \
 -e DRONE_RPC_HOST=yasinshaw.com:20080 \
 -e DRONE_RPC_SECRET=your_drone_secret \
 -e DRONE_RUNNER_CAPACITY=2 \
 -e DRONE_RUNNER_NAME=runner-docker \
 -e DOCKER_API_VERSION=1.38 \
 -v /var/run/docker.sock:/var/run/docker.sock \
 -p 21300:3000 \
 --restart always \
 --name runner \
 drone/drone-runner-docker
 
 docker run -d \
-e DRONE_RPC_PROTO=http \
-e DRONE_RPC_HOST=yasinshaw.com:20080 \
-e DRONE_RPC_SECRET=your_drone_secret \
-e DOCKER_API_VERSION=1.38 \
-p 22300:3000 \
--restart always \
--name runner-ssh \
drone/drone-runner-ssh

这里需要设置一下DOCKER_API_VERSION,即使用的docker API的版本。默认是使用的drone支持的最高的版本,但如果机器的docker版本更低,drone会提示,docker api不能高于xx版本,这里启动runner的时候设置一下DOCKER_API_VERSION就好。

配置drone

具体的配置后面可以在开源的项目代码中找到。这里可以先给大家看一下之前配置的一个前端项目。大概的流程就是在本地build,build完成后打包镜像,然后上传到阿里云镜像仓库。然后上服务器拉取最新的镜像,再重启docker。仅供参考:

kind: pipeline
name: build

steps:
  - name: npm install
    image: node:12-buster-slim
    commands:
      - npm install -g cnpm --registry=https://registry.npm.taobao.org
      - cnpm install
      - cnpm i @nuxtjs/axios
      - cnpm i @nuxtjs/toast
      - cnpm i @nuxtjs/proxy

  - name: npm build
    image: node:12-buster-slim
    commands:
      - npm run build

  - name: docker
    image: plugins/docker
    settings:
      username: yasinshaw
      password:
        from_secret: docker_password
      repo: registry.cn-hangzhou.aliyuncs.com/yasinshaw/yasinshaw-portal
      registry: registry.cn-hangzhou.aliyuncs.com
      mirror: https://mzayqkhl.mirror.aliyuncs.com
      tags: latest

---
kind: pipeline
type: ssh
name: deploy

server:
  host: yasinshaw.com
  user: root
  ssh_key:
    from_secret: ssh_key

steps:
  - name: pull image
    environment:
      DOCKER_PASSWORD:
        from_secret: docker_password
    commands:
      - docker login --username=yasinshaw --password=$DOCKER_PASSWORD registry.cn-hangzhou.aliyuncs.com
      - docker pull registry.cn-hangzhou.aliyuncs.com/yasinshaw/yasinshaw-portal:latest

  - name: remove old container
    failure: ignore
    commands:
      - docker rm -f -v portal

  - name: start container
    commands:
      - docker run -d --name=portal --restart=always -p 3000:3000 registry.cn-hangzhou.aliyuncs.com/yasinshaw/yasinshaw-portal:latest
depends_on:
  - build

这里的secret需要去drone的界面上配置。secret的具体用法可以参考官方文档:
https://docs.drone.io/secret/

至此,一个基于docker的简单的CI/CD流程就搭建完成,下一步就可以创建项目开始开发啦~

————————————————

版权声明:本文为CSDN博主「编了个程」的原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接及本声明。

原文链接:https://blog.csdn.net/yasinshaw/article/details/110019572

相关推荐

跨境卖家必看:营销与产品,到底谁才是你的“摇钱树”?

在跨境电商的江湖里,永远流传着两个极端传说:有人靠“一张神图”日销万单,也有人因“产品垃圾”被骂到关店。营销与产品,究竟谁才是跨境卖家的命根子?今天,我们不灌鸡汤,只讲能让你“活下去”的生存法则。...

旺自己的三种方法,一定要牢记

三种旺己之道,开启丰盈人生生活的转机往往藏在自我经营的智慧里。想要旺自己,不妨从这三个方向深耕,让生命绽放独特光彩。专注自我成长,夯实内在根基。...

让顾客感觉占便宜的20种营销策略之赠品策略(三)

赠品策略:巧妙馈赠,让顾客感知超值顾客不喜欢便宜,喜欢的是占便宜的感觉!如何让顾客感觉自己占到了便宜?赠品策略是一种能有效拉近与顾客距离,使其切实感受实惠与惊喜的营销方式。以下为您详细解读常见的赠品...

成都网上注册公司流程

成都注册公司:【四川龙眼企服】成都网上注册公司流程:先得给公司取个响亮又合规的名字,登录当地工商行政管理部门网站,在企业名称预先核准系统查。名字通过后,就得准备注册材料啦,像公司章程、股东身份证明、注...

企业定制网站的优势有哪些?

企业定制网站具有多方面的显著优势,能够精准契合企业需求,助力企业在网络世界中脱颖而出。以下是其主要优势的详细介绍:精准匹配业务需求定制网站能够依据企业的具体业务模式、行业特点以及目标受众,量身定制功能...

学术交流新窗口:微网站搭建赋能会议组织全流程升级

在当今信息化快速发展的时代,学术会议的组织与管理也逐渐向数字化转型。微网站作为学术会议前期准备的重要组成部分,不仅是会议宣传推广的窗口,更是注册报名、征文管理等多项功能的集成平台。本文将对学术会议微网...

网站域名备案流程?分享一下自己的经历

这里以腾讯云为例。想要开发一个网站,网站备案这个流程是必不可少的。首先你要买一个域名,还要买一个服务器,这样就可以备案了。备案分为企业备案和个人备案,企业备案我不清楚,但是个人备案相对比较简单。个人备...

不容错过的网站建设公司总览!

在当今数字化浪潮席卷全球的时代,网络世界的发展可谓日新月异。截至2025年,全球网站总量已然突破20亿个大关,在这个信息爆炸的网络时代,企业官网的重要性愈发凸显。数据显示,高达75%的用户会通过企业官...

从零搭建网站?5个步骤详解网站建设全流程

在数字化时代,拥有一个专业网站已成为企业或个人品牌展示的核心竞争力。但对于新手而言,网站建设往往显得复杂难懂。本文梳理出5大关键步骤,手把手带你完成从策划到上线的全流程,省时省力不踩坑!一、前期准备:...

如何给自己的公司建网站?会打字就能自己做网站

零基础快速使用观达云建站平台为公司建网站,可参考以下步骤:注册与登录访问观达云建站平台官网,点击注册按钮,填写相关信息完成账号注册,然后登录账号。...

电商网的SEO优化策略方法

1、内容质量:网站的内容质量在SEO优化中的分量是最大的,只有有了好的内容才能吸引客户,只有有了独特的内容才能让网页的排名超过泛泛而谈的网页。2、站内基本优化:站内的基本优化则包含网站的内部链接的最大...

现在的网站SEO就该这么做

笔者第一次正事的写一篇完整的博文,主要自己的写作能力很屌丝,一直没怎么完整的写过一篇文章,虽然有自己的博客,但是很多内容是自己收集和组织别人的内容,还有很多内容是直接转载而来。现在要改变下,之后会把自...

逆冬:讲3个SEO相关小问题!权重+收录+15天定律

又是一个周六,由于最近在忙另外一个项目,文章就耽误了,最近又有徒弟相关问题,还有一些同学催更。针对徒弟们问题,我们再来给大家统一讲解!一、15天定律(如何过)...

企业如何抓住AI搜索优化红利?从SEO到GEO的实战转型指南

你是否发现,最近在搜索问题时,答案直接显示在顶部而不需要点击链接?这背后是AI搜索革命正在改写流量规则。据统计,80%的消费者已在30%的搜索中依赖AI摘要,传统网站点击量下降高达10%。当DeepS...

就得仿这样的~来自dribbble上的简约大气网页设计欣赏

谁说简洁的排版不能出彩!好的页面永远是把最重要的信息传达给用户,简单利落!一组简洁的网站首页设计欣赏。下面收集来自于dribbble上的优秀网页设计作品希望对你带来帮助。...

取消回复欢迎 发表评论: