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

目录

文章目录

前言

一、第一步:创建文件夹

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

三、第三步:打开防火墙


文章目录

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

前言

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


一、第一步:创建文件夹

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

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

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

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

5、放入我们的前端代码


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

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

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

3、配置前端的信息


三、第三步:打开防火墙

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

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

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

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

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

部署成功!!! 


总结

前端部署分为3步:

1、创建文件夹

2、开始前端部署

3、开启防火墙

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

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

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

相关文章

opencv入门到精通——图像上的算术运算

目录 目标 图像加法 图像融合 按位运算 目标 学习图像的几种算术运算,例如加法,减法,按位运算等。 您将学习以下功能:cv.add,cv.addWeighted等。 图像加法 您可以通过OpenCV函数cv.add()或仅通过numpy操作res …

综述 2022-Briefings in Bioinformatics:多模态AI+生物医学数据(主要集中于多组学数据)

Stahlschmidt, Sren Richard, Benjamin Ulfenborg, and Jane Synnergren. "Multimodal deep learning for biomedical data fusion: a review." Briefings in Bioinformatics 23.2 (2022): bbab569. https://doi.org/10.1093/bib/ bbab569 被引次数:124 …

java八股jvm

JVM虚拟机篇-01-JVM介绍、运行流程_哔哩哔哩_bilibili 1.PC程序计数器 2.堆 3.虚拟机栈 4.方法区/永久代/元空间 5.直接内存 JVM虚拟机篇-06-JVM组成-你听过直接内存吗_哔哩哔哩_bilibili 6.双亲委派 从下往上找,有同名类优先使用上级加载器的,不用自…

JavaWeb笔记之前端开发JQuery

一、引言 1.1 概述 jQuery是一个快速、简洁的JavaScript代码库。jQuery设计的宗旨是“Write Less,Do More”,即倡导写更少的代码,做更多的事情。它封装JavaScript常用的功能代码,提供一种简便的 JavaScript操作方式&#xff0c…

nginx userid到底做了啥?

我们公司在用nginx的userid模块作为简单的用户请求追踪使用。这个模块其实并不能真正记录用户的请求状态,只能作为一个辅助使用。但是在一些场景下会有一些异常。下面我们简单介绍一下这个模块到底做了什么。 userid 模块简介 官网说明文档 ngx_http_userid_modul…

黑盒测试与白盒测试(超详细整理)

黑盒测试与白盒测试是软件测试中两种不同的测试方法,它们的主要区别在于测试者对被测试软件的了解程度。下面,我们将详细介绍这两种测试方法的特点和适用场景。 一、黑盒测试 黑盒测试又称为功能测试,是针对被测试软件的功能进行测试的一种…

Java_队列(Queue)详解

目录 前言 队列(Queue) 概念 队列的使用 循环队列 循环队列的构思 代码的实现 双端队列(Deque) 概念 方法 双端队列的使用 前言 超详细地讲解了循环队列,为什么要有循环队列 , 普通队列 , 双端队列 队列(Queue) 概念 队列:只允许在一端进行插入数据操…

“做开源犹如养护花朵,花开需要时间”|2023年度总结

你好,我是 Kagol。 2023年已经接近尾声,OpenTiny 从一颗种子🥑逐渐发芽🌱、出苗🌿、长叶🍃,希望明年能长成一棵大树🌲。 回顾 OpenTiny 开源这10个月,我们付出了非常多…

【vue】开发常见问题及解决方案

有一些问题不限于 Vue,还适应于其他类型的 SPA 项目。 1. 页面权限控制和登陆验证页面权限控制 页面权限控制是什么意思呢? 就是一个网站有不同的角色,比如管理员和普通用户,要求不同的角色能访问的页面是不一样的。如果一个页…

MySQL中CASE when 实战

CASE 语法 CASEWHEN condition1 THEN result1WHEN condition2 THEN result2WHEN conditionN THEN resultNELSE result END; 将表中的内容转换为右边的形式: 1、创建表,创建数据 CREATE TABLEchapter10_7 (order_id VARCHAR(255) NULL,price VARCHAR(25…

el-tree lazy懒加载(进阶版)

2023.12.22今天我学习了el-tree如何实现懒加载&#xff0c;效果如&#xff1a; 代码如下&#xff1a; 懒加载的使用不需要用:data <template><div><el-tree:props"props":load"loadNode"lazynode-key"id"show-checkbox/><…

WEB 3D技术 three.js 设置图像随窗口大小变化而变化

本文 我们来讲讲我们图层适应窗口变化的效果 可能这样说有点笼统 那么 自适应应该大家更熟悉 就是 当我们窗口发生变化说 做一些界面调整比例 例如 我们这样一个i项目界面 我们打开 F12 明显有一部分被挡住了 那么 我们可以刷新 这样是正常了 但是 我们将F12关掉 给F12的…