首页 > 其他分享 >nextjs 实战开发1 Mercury 二级域名分发系统| 曲速引擎 Warp Drive

nextjs 实战开发1 Mercury 二级域名分发系统| 曲速引擎 Warp Drive

时间:2024-10-31 23:10:12浏览次数:4  
标签:Mercury 二级域名 0.0 曲速 博客 开发 组件

开发目标

开发一个免费的二级域名分发系统


创建项目

root@ubuntu:~/dev-nextjs/mercury_frontend# pnpm create next-app@latest .
版本:pnpm -v 9.12.2
版本:node -v v20.16.0
版本:next 15.0.2

为了开发方便,我们要将脚手架的package.json进行修改,next dev -H 0.0.0.0 -p 80,这样当我们运行 pnpm run dev的时候就会自动执行 next dev -H 0.0.0.0 -p 80,在开发的时候可以使用80端口进行访问方便很多。

老规矩,这个是初始化之后的脚手架,到这里就证明我们的开发环境配置没有问题,可以继续开发了。

如果不懂如何配置开发环境,请百度搜索:曲速引擎 warp drive csdn 在首页找到我的技术博客访问地址,里面有更新一系列0基础教学入门文章,一线更新内容也将会在我的个人博客上面更新,谢谢大家。

梳理开发模块

首先 网站分为三部分 页眉、主体部分、页脚

  1. 页眉

  2. 主体部分

  3. 页脚

页眉部分组件

  1. logo 图标
  2. logo 组件
  3. Blog 页面
  4. About Us 页面
  5. Login 按钮控制登录 (Google 单点登录)

主体部分组件

  1. 网站介绍组件
  2. 查询二级域名使用情况组件
  3. 二级域名管理组件
    1. 添加DNS记录组件 (From表单运用)
    2. 展示DNS记录组件 (Table表格运用)
  4. 功能介绍组件
  5. 客户展示组件
  6. 用户订阅组件

页脚部分组件

  1. 服务条款组件
  2. 隐私政策组件
  3. Cookie政策组件
  4. 网站版权组件
  5. 警告组件

解决权限控制、跨域处理、谷歌单点登录等问题,以上就是本次教程的功能开发结构,未来的文章将会按照这个结构逐步实现,本次文章到这里结束啦,如果喜欢我的文章请百度搜索:曲速引擎 warp drive csdn 在首页找到我的技术博客访问地址,所有内容都将在我的技术博客上展示,比起其他平台更容易搜索完整版本。

更详细内容查看

独立博客 https://www.dataeast.cn/
CSDN博客 https://blog.csdn.net/siberiaWarpDrive
B站视频空间 https://space.bilibili.com/25871614?spm_id_from=333.1007.0.0
关注 “曲速引擎 Warp Drive” 微信公众号

标签:Mercury,二级域名,0.0,曲速,博客,开发,组件
From: https://www.cnblogs.com/XiaoH160309/p/18519124

相关文章

  • Next.js 零基础开发入门教程2 构建基础脚手架 2024最新更新中|曲速引擎 Warp Drive
    开发目标我们将构建一个简化版本的财务仪表板,其内容包括:公共主页、登录页面、受身份验证保护的仪表板页面、用户可以添加、编辑和删除发票这篇文章先创建一个简单的nextjs脚手架页面安装pnpm包管理器接上一篇,开发环境都准备好之后,我们来做创建项目的准备,首先先判断上一篇的环......
  • Next.js 实战开发入门 1 开发环境部署 - 曲速引擎 Warp Drive
    开发目标我们将构建一个简化版本的财务仪表板,其内容包括:公共主页、登录页面、受身份验证保护的仪表板页面、用户可以添加、编辑和删除发票开发环境配置开发客户端Windows10(不限系统,兼容vscode即可)开发服务端Ubuntu24.04(不限系统,兼容node即可)开发工具VscodeVersion:......
  • 网站二级域名+cploar+shinyproxy构建web APP私有服务器
    网站二级域名+cploar+shinyproxy构建webAPP私有服务器WebAPP是一种功能相对单一的,可以在浏览器中运行的应用程序,构建相对容易且易于传播,被认为是临床预测模型最佳的载体。一种理想的情况,就是我们将构建的各种临床预测模型放置到网上,以“微服务”的形式存在,需要的时候登......
  • 带支付等功能的二级域名分发系统美化版源码+内附搭建教程
    介绍:今天给大家搭建一个二级域名分发系统二开版(代码改了下,勿喷)这个程序是快乐域名的,拿去用就可以了!星光云主机:www.aa1.asia环境:php7.1以上现在我们来打开面板1.创建网站,上传源码至网站根目录,解压、解压完成后直接打开域名进行安装2.安装地址:域名/install/安装步骤下一......
  • nginx+tomcat+二级域名+https
    1.添加域名解析在腾讯云或者阿里云中添加域名解析,解析到具体得ip​​2.购买SSL证书在腾讯云或者阿里云中购买相应的SSL,基本上每个SSL只能解析一个HTTPS,所以如果你有多个二级域名设置HTTPS的话,需要申请多个SSL3.安装多个tomcat3.1下载tomcat安装包放入服务器中从网上下载t......
  • Nginx设置二级域名映射到不同的Tomcat
    一、前言在之前的博客中,已经安装好了多个tomcat和nginx,本篇博客将介绍如何设置不同的二级域名转发到不同的tomcat上二、配置服务器端我使用的是腾讯云服务器,只需要在云解析中配置相关域名信息即可三、配置nginx进入nginx的配置文件中cd/usr/local/nginx/confvimnginx.c......
  • 二级域名nginx 配置
     访问地址http://二级域名称.域名名称.com/server{   listen80;server_name二级域名称.一级域名xxxxx.com;location/{proxy_passhttp://localhost:8282;}}server{listen8282;server_namelocalhost;......
  • Mercury性能测试模板
    xxxxxxxxxx性能测试报告                                                                   2023年11月8日    目 录   1前言   11第一章XXXXXXXX核心业务系统性能测试概述   1......
  • 水星 Mercury MIPC251C-4 网络摄像头 ONVIF 与 PTZ 云台控制
    概况最近在什么值得买上发现一款水星的网络摄像头,除了支持云台/夜视功能之外,还标明支持onvif协议.所以想着买来接入到HomeAssistat作为监控使用.可到手之后发现事情并没有那么简单,记录如下.接入HomeAssistant按照HA的文档 ONVIFCamera 接入无非就是配置文......
  • 关于域名,一级域名,二级域名等的理解及阐述
    域名:是由一串用点分隔的字符组成的互联网上某一台计算机或计算机组的名称,用于在数据传输时标识计算机的电子方位。域名里的英文字母不区分大小写,因此可以使用大写方法拼写,但一般都以小写形式拼写。但通常现在来看有几个点就为几级域名。网上关于一级域名二级域名有两种不同的......