使用宝塔面板部署前端项目到服务器

目录

文章目录

前言

一、第一步:创建文件夹

二、第二步:部署前端项目

三、第三步:打开防火墙


文章目录

  • 前言
  • 第一步:创建文件夹
  • 第二步:部署前端项目
  • 第三步:打开防火墙
  • 总结

前言

在此之前,我们已经创建了宝塔面板账号、拥有了一台服务器。现在,我们想让我们的前端能够像阿里巴巴、淘宝等网站那样被别人访问,那么我们应该在宝塔面板上面怎样做呢?


一、第一步:创建文件夹

1、打开我们的宝塔面板后,我们会看到左侧有一列目录,点击里面的文件。

2、点击在根目录下名叫www的文件夹

3、点击里面叫wwwroot的文件夹

4、在里面随便创建一个文件夹准备放入我们的前端代码

5、放入我们的前端代码


二、第二步:部署前端项目

1、在宝塔面板的左侧有个叫网站的名字,点进去并选择node项目

2、添加我们刚才放入的项目

3、配置前端的信息


三、第三步:打开防火墙

1、点击自己的项目,可以查看自己的项目运行情况

2、在左侧有个项目日志,可以观看是否运行成功

3、打开自己端口的防火墙

4、在服务器那边也要开启端口

5、使用端口+ip到网页上面访问

部署成功!!! 


总结

前端部署分为3步:

1、创建文件夹

2、开始前端部署

3、开启防火墙

前端部署后最直观的就是看见网页,但后端没有部署是无法实现功能的,在后面将有如何这是数据库和项目的一键部署。如果这篇文章对你有帮助的话请点点赞和收藏。如果网站和文章有问题的话也可以私信我或指出来!!!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/239621.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

智能优化算法应用:基于鹰栖息算法3D无线传感器网络(WSN)覆盖优化 - 附代码

智能优化算法应用:基于鹰栖息算法3D无线传感器网络(WSN)覆盖优化 - 附代码 文章目录 智能优化算法应用:基于鹰栖息算法3D无线传感器网络(WSN)覆盖优化 - 附代码1.无线传感网络节点模型2.覆盖数学模型及分析3.鹰栖息算法4.实验参数设定5.算法结果6.参考文…

DHorse v1.5.0 发布,基于 k8s 的发布平台

版本说明 新增特性 支持同一机器部署多个DHorse服务;支持Next、.NET应用部署;优化Node、Nuxt应用构建和部署的性能;默认使用fabric8客户端与k8s集群交互,可以通过指定参数-Dkubernetes-clientofficial切回到k8s官方客户端&#…

亚马逊推出 Graviton4:具有 536.7 GBps 内存带宽的 96 核 ARM CPU

如今,许多云服务提供商都设计自己的芯片,但亚马逊网络服务 (AWS) 开始领先于竞争对手,目前其子公司 Annapurna Labs 开发的处理器可以与 AMD 和英特尔的处理器竞争。本周,AWS 推出了 Graviton4 SoC,这是一款基于 ARM 的…

【Filament】绘制圆形

1 前言 Filament环境搭建中介绍了 Filament 的 Windows 和 Android 环境搭,绘制三角形中介绍了绘制纯色和彩色三角形,绘制矩形中介绍了绘制纯色和彩色矩形,本文将使用 Filament 绘制圆形。 2 绘制圆形 本文项目结构如下,完整代码…

RetinaNet:Focal Loss for Dense Object Detection(CVPR2018)

文章目录 Abstract北京发现问题并给出方法成果 IntroductionRelated WorkRobust 评估 Focal LossBalanced Cross EntropyFocal Loss DefinitionClass Imbalance and Model InitializationClass Imbalance and Two-stage Detectors RetinaNet DetectorExperimentsConclusion hh …

基于SpringBoot的桃花峪滑雪场租赁系统 JAVA简易版

目录 一、摘要1.1 项目介绍1.2 项目录屏 二、功能模块2.1 游客服务2.2 雪场管理 三、数据库设计3.1 教练表3.2 教练聘请表3.3 押金规则表3.4 器材表3.5 滑雪场表3.7 售票表3.8 器材损坏表 四、系统展示五、核心代码5.1 查询教练5.2 教练聘请5.3 查询滑雪场5.4 滑雪场预定5.5 新…

WebAssembly 的魅力:高效、安全、跨平台(上)

🤍 前端开发工程师(主业)、技术博主(副业)、已过CET6 🍨 阿珊和她的猫_CSDN个人主页 🕠 牛客高级专题作者、在牛客打造高质量专栏《前端面试必备》 🍚 蓝桥云课签约作者、已在蓝桥云…

JUC并发编程 08——原子操作类

目录 一.原子更新基本类型类 实现原理 二.原子更新数组 三.原子更新引用类型 四.原子更新字段类 Java从JDK1.5开始提供了J.U.C下的atomic包,atomic包提供了一系列的操作简单,性能高效,并能保证线程安全的类去更新基本类型变量&#xff0…

WebAssembly 的魅力:高效、安全、跨平台(下)

🤍 前端开发工程师(主业)、技术博主(副业)、已过CET6 🍨 阿珊和她的猫_CSDN个人主页 🕠 牛客高级专题作者、在牛客打造高质量专栏《前端面试必备》 🍚 蓝桥云课签约作者、已在蓝桥云…

Unity中的导航系统

NavMesh(导航网格)是3D游戏世界中用于实现动态物体自动寻路的一种技术,将游戏中复杂的结构组织关系简化为带有一定信息的网格,在这些网格的基础上通过一系列的计算来实现自动寻路。导航时,只需要给导航物体挂载导航组建,导航物体便…

【Grafana】Grafana匿名访问以及与LDAP连接

上一篇文章利用Docker快速部署了Grafana用来展示Zabbix得监控数据,但还需要给用户去创建账号允许他们登录后才能看展示得数据,那有什么办法让非管理员更方便得去访问Grafana呢?下面介绍两个比较方便实现的: 在开始设置前&#xff…

显示器屏幕oled的性能、使用场景、维护

OLED显示器屏幕具有许多独特的性能和使用场景,以下是关于OLED显示器屏幕的性能、使用场景和维护的详细介绍: 一、性能 色彩鲜艳:OLED显示器屏幕能够呈现出更加鲜艳的色彩,色彩饱和度高,色彩还原性好,可以给…

SpringBoot+JaywayJsonPath实现Json数据的DSL(按照指定节点表达式解析json获取指定数据)

场景 若依前后端分离版手把手教你本地搭建环境并运行项目: 若依前后端分离版手把手教你本地搭建环境并运行项目_前后端分离项目本地运行-CSDN博客 在上面搭建SpringBoot项目的基础上,并且在项目中引入fastjson、hutool等所需依赖后。 Jayway JsonPat…

【【C++11特性篇】【强制/禁止 】生成默认函数的关键字default&delete(代码演示)

前言 大家好吖,欢迎来到 YY 滴C系列 ,热烈欢迎! 本章主要内容面向接触过C的老铁 主要内容含: 欢迎订阅 YY滴C专栏!更多干货持续更新!以下是传送门! YY的《C》专栏YY的《C11》专栏YY的《Linux》…

动物分类识别教程+分类释义+界面展示

1.项目简介 动物分类教程分类释义界面展示 动物分类是生物学中的一个基础知识,它是对动物进行分类、命名和描述的科学方法。本教程将向您介绍动物分类的基本原则和方法,并提供一些常见的动物分类释义。 动物分类的基本原则 动物分类根据动物的形态、…

vue3老项目如何引入vite

vue3老项目如何引入vite 安装 npm install vite vitejs/plugin-vue --save-dev Vite官方中文文档修改package.json文件 在 npm scripts 中使用 vite 执行文件 "scripts": {"serve": "vite","build": "vite build","pr…

听GPT 讲Rust源代码--src/tools(22)

File: rust/src/tools/tidy/src/lib.rs rust/src/tools/tidy/src/lib.rs是Rust编译器源代码中tidy工具的实现文件之一。tidy工具是Rust项目中的一项静态检查工具,用于确保代码质量和一致性。 tidy工具主要有以下几个作用: 格式化代码:tidy工具…

Rust报错:the msvc targets depend on the msvc linker but `link.exe` was not found

当我在我的 windows 电脑上安装 rust,然后用 cargo 新建了一个项目后,cargo run 会报错: error: linker link.exe not found| note: program not foundnote: the msvc targets depend on the msvc linker but link.exe was not foundnote: p…

css学习笔记6(盒子模型)

CSS盒子模型 五、CSS盒子模型1.CSS长度单位2.元素的显示模式3.总结各元素的显示模式4.修改元素显示模式5.盒子模型的组成6.盒子内容区(content)7.关于默认宽度8.盒子内边距(padding)9.盒子边框(border)10.盒…

Apache Flink 进阶教程(七):网络流控及反压剖析

目录 前言 网络流控的概念与背景 为什么需要网络流控 网络流控的实现:静态限速 网络流控的实现:动态反馈/自动反压 案例一:Storm 反压实现 案例二:Spark Streaming 反压实现 疑问:为什么 Flink(bef…