当前位置: 首页 > news >正文

项目写完后,怎么部署并上线?新手也能看懂

很多人项目能在本地跑起来,但一到“上线”就懵了:代码传到哪里?命令在哪输入?Nginx 到底改哪里?哪些配置在服务器改,哪些在项目里改?

这篇就讲一套最常见、也最适合新手入门的方式:

云服务器 + Linux + Nginx + 前后端分离项目

这套方案不花哨,但很常见,很多公司都会接触到。先把这个学会,再学 Docker、K8s 会轻松很多。

一、上线到底是在做什么

简单说,就是把你本地的项目,放到一台公网服务器上,让别人通过IP域名访问。

一般会分成这几步:

  1. 买一台云服务器

  2. 连接到服务器

  3. 安装项目运行环境

  4. 把前端和后端代码上传到服务器

  5. 启动后端服务

  6. 用 Nginx 配置前端访问和接口转发

  7. 绑定域名、放行端口

二、安装基础环境是为什么

因为服务器刚买来时,通常只有一个基础系统,不能直接跑你的项目。

你需要按项目类型安装对应环境:

  • 前端页面要能被 Nginx 提供访问

  • Java 项目要安装 JDK

  • Node 项目要安装 Node.js

  • Python 项目要安装 Python

  • 如果项目要连数据库,还要准备 MySQL 或其他数据库

你可以把它理解成:本地电脑能跑,是因为你电脑已经有这些环境;服务器也一样,必须先装好。

三、这些命令到底在哪输入

这是新手最容易混的地方。

1. 本地电脑里输入的命令

比如这些:

npm run build

这是在你自己的电脑里输入,用来把前端项目打包。

2. 服务器里输入的命令

比如这些:

sudo apt install nginx -y nohup java -jar app.jar &

这是先通过 SSH 连上服务器后,再在服务器终端里输入。

也就是说:

  • 本地终端:负责打包、上传文件

  • 服务器终端:负责安装环境、启动项目、改 Nginx

四、前端和后端代码怎么放到服务器上

这是上线里最实际的一步。

1. 先在本地准备好文件

前端

先在本地项目目录执行:

npm run build

执行后一般会生成一个dist文件夹,这就是要上传到服务器的前端文件。

后端

按你的项目类型准备:

  • Java:打成jar

  • Node.js:准备项目源码和package.json

  • Python:准备源码和requirements.txt

2. 再把文件上传到服务器

你可以用两种常见方式。

方式一:用工具上传

适合新手:

  • FinalShell

  • Xshell + Xftp

  • MobaXterm

连接服务器后,直接把文件拖到服务器目录里,比如:

/home/project

方式二:用命令上传

如果你会命令行,也可以本地执行:

scp -r dist root@服务器IP:/home/project/frontend scp -r backend root@服务器IP:/home/project/backend

意思是:

  • 把本地dist上传到服务器/home/project/frontend

  • 把后端代码上传到服务器/home/project/backend

五、服务器上一般放成什么结构

推荐这样放:

/home/project /frontend /backend
  • frontend:放前端打包后的静态文件

  • backend:放后端代码或运行包

这样目录清楚,后面配置 Nginx 也方便。

六、Nginx 在哪里配置,后端配置又改哪里

这个也很重要,很多人会混。

1. Nginx 配置

Nginx 是服务器软件,所以它的配置文件改的是服务器里的文件,不是在你的前端项目里改。

常见位置:

/etc/nginx/nginx.conf

或者:

/etc/nginx/sites-available/default

也就是说,Nginx 配置是在服务器上改。

2. 后端项目配置

后端端口、数据库地址、账号密码这类配置,一般在你后端项目自己的配置文件里改,比如:

  • Java:application.ymlapplication.properties

  • Node.js:.env

  • Python:项目配置文件或环境变量

也就是说:

  • 域名访问、接口转发:改 Nginx

  • 端口、数据库、业务配置:改后端项目配置

七、最常见的一套实际部署流程

1. 买 Linux 服务器

新手建议直接买云服务器,系统选:

Ubuntu 22.04

2. 连接服务器

本地终端输入:

ssh root@你的服务器IP

连上以后,你后面输入的 Linux 命令,都是在服务器里执行。

3. 安装基础环境

服务器里输入:

sudo apt update sudo apt install nginx -y

如果后端是 Java:

sudo apt install openjdk-17-jdk -y

如果后端是 Node.js:

sudo apt install nodejs npm -y

4. 上传前端和后端代码

把文件传到:

/home/project/frontend /home/project/backend

5. 启动后端

如果是 Java:

cd /home/project/backend nohup java -jar app.jar > app.log 2>&1 &

如果是 Node.js:

cd /home/project/backend npm install nohup npm run start > app.log 2>&1 &

假设后端跑在8080端口。

6. 配置 Nginx

在服务器里编辑 Nginx 配置文件:

sudo vim /etc/nginx/sites-available/default

示例:

server { listen 80; server_name 你的域名或服务器IP; ​ location / { root /home/project/frontend; index index.html; try_files $uri $uri/ /index.html; } ​ location /api/ { proxy_pass http://127.0.0.1:8080/; proxy_set_header Host $host; proxy_set_header X-Real-IP $remote_addr; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; } }

它的作用是:

  • 打开网站时,先访问前端页面

  • 当前端请求/api时,Nginx 再转发给后端

改完后执行:

sudo nginx -t sudo systemctl restart nginx

7. 放行端口

你至少要放行:

  • 22:远程连接服务器

  • 80:HTTP 访问网站

  • 443:HTTPS 访问网站

如果云服务器安全组没开,项目即使已经启动,外网也访问不到。

八、公司里真的只会用这种简单方式吗

小公司、内部系统、测试环境,或者简单业务项目,确实经常会用这种方式。

因为它的优点很明显:

  • 成本低

  • 部署快

  • 容易排查问题

  • 新手容易上手

但公司不一定永远只用这一种。

等你把这套学熟后,可以继续学习这些更常见的进阶方式:

  • Docker:把环境和项目一起打包,减少“我电脑能跑,服务器不能跑”

  • Docker Compose:同时管理前端、后端、数据库、Redis

  • Jenkins / GitLab CI:自动化部署

  • Kubernetes(K8s):适合更复杂、更大规模的服务管理

  • CDN + 对象存储:专门托管前端静态资源

九、新手最该先学会什么

不要一开始就扑进 Docker 和 K8s。

先把下面这件事独立做通:

本地打包 -> 上传服务器 -> 启动后端 -> 配置 Nginx -> 外网访问成功

只要这条链路你走通一次,你就已经真正理解“项目上线”了。

十、总结

对于新手来说,最适合先学会的部署方式就是:

Linux 服务器 + 上传项目文件 + 启动后端 + Nginx 反向代理

它不是最高级的方案,但它足够常见,也足够实用。先把这套学会,再去学 Docker、自动化部署、K8s,思路会清楚很多。

http://www.jsqmd.com/news/1006935/

相关文章:

  • 重新掌控你的浏览器:uBlock Origin终极隐私保护指南
  • 云原生助力政府数字化
  • 本地行业实测!武汉黄金变现靠谱选择汇总 - 讯息早知道
  • MC68SZ328 DragonBall Super VZ:经典嵌入式SoC的架构解析与实战设计
  • 人形机器人在工业装配中的真实靶心:结构化动作执行
  • 小说下载工具:打造你的永久数字图书馆
  • SRTP与MACsec硬件加速实战:从PDB配置到错误排查的工程指南
  • 嵌入式Flash存储:从原理到实战,解析NXP 56F80xx安全编程与调试
  • 告别B站缓存视频碎片化:Android上一键合并导出完整MP4的终极方案
  • 终极指南:5分钟免费打造专业级富文本编辑器界面
  • 基因组水平转移检测完整指南:使用HGTector2快速发现跨物种基因流动
  • 颠覆茅台预约体验:Campus-imaotai全自动预约系统深度解析
  • ARM9核心SoC i.MX21架构解析与嵌入式开发实战
  • 终极Steam成就管理工具:3步快速解锁游戏全成就
  • 2026年太原财税管理公司哪家强?本土机构对比测评 - 互联百晓生
  • 破解教育资源获取难题:tchMaterial-parser 让国家中小学智慧教育平台电子课本下载变简单
  • MC68341嵌入式开发实战:勘误解析与硬件设计避坑指南
  • FAB设备OEE自动化分析工具:月度报表从2天缩短到30秒
  • 成功的大数据治理项目须坚持“六个导向”和“三个相结合”
  • DeepSeek融了500亿,但中国AI巨头们同床异梦
  • 智源大会圆桌大模型没有终局具身智能可能是中国的 AlphaGo 时刻
  • 告别纸质回执!“报名管家”手写签字知情同意书,全功能免费引爆校园全场景接龙 一张纸质“家长签字回执”,折腾了多少班主任? - 亲测好用工具
  • 不止于抓包:用Ubiqua的Network Explorer和Graphic View透视你的Zigbee网络拓扑与设备关系
  • i.MX21 DMA控制器寄存器深度解析与驱动开发实战
  • Windows系统内存管理革命:Mem Reduct轻量级实时监控与优化解决方案
  • fast.ai工程师必备:Linux四层状态机实战指南
  • 2026免费在线抠图工具推荐|6款高效AI去背景工具使用攻略
  • 2026无锡代理记账公司推荐榜:这些口碑实力排前列 - 速递信息
  • Python进阶:从执行模型与对象机制理解真实Bug根源
  • 分析的未来是多模态的一切都关乎 Vibe 技术趋势