【部署】docker容器化 前端学习

Docker | Docker+Nginx部署前端项目 大家好,我是Leo哥🫣🫣🫣,这篇文章中,我们已经学习了如何通过Docker来部署我们SpringBoot项目,那么我们这篇文章教大家如何通过Docker + Nginx + Dockerfile的方式去部署我的前端项目。好了,话不多说让我们开始吧😎😎😎。其实部署前端项目的方式有很多种,其实也可以Docker安装Nginx的方式,把前端dist目录上传即可,这种是比较常规的一种方式。今天我们为大家介绍另一种方式,再Dockefile去构建我们的镜像。 阅读详情

1.容器化

 容器化是将应用程序或服务、其依赖项及其配置(抽象化为部署清单文件)一起打包为容器映像的一种软件开发方法

特点:

  • 一致的运行环境
  • 可伸缩性
  • 更方便的移植
  • 隔离性  

2.Docker 

go语言开发的应用容器引擎, 基于容器化,沙箱机制的应用部署技术。可适用于自动化测试、打包,持续集成和发布应用程序等场景

Docker中三个重要概念

  • 镜像(image):分片的(只读)文件系统,由Dockerfile创建独立、易扩展、更效率

  • 容器(container):由Docker进程创建和管理的:文件系统 + 系统资源 + 网络配置 + 日志管理;docker是docker镜像的运行环境,所以容器的概念就比较好理解了

  • 仓库(registry):用来远端存储docker镜像;版本控制、变更管理、为持续集成与快速部署提供便利

示意图: 

 tips:docker与虚拟机的比较?

3.Docker工作原理

Docker是容器化部署技术,它主要作用在于通过运行容器来实现应用部署,而容器基于镜像运行。仓库则管理镜像。

简单地说,就是将你的项目和依赖包(基础镜像)打成一个带有启动指令的项目镜像,然后在服务器创建一个容器,让镜像在容器内运行,从而实现项目的部署。

4.Docker安装

Docker的安装建议上阿里云【容器镜像服务】查找,很详尽 

mac安装:https://docs.docker.com/docker-for-mac/install/

window安装:https://docs.docker.com/docker-for-windows/install/  

这里因为我使用的是win7,所以安装的是docker toolbox,关于docker toolbox的安装,建议在阿里云的容器镜像服务中找,从安装到切换国内镜像,都妥了。

那如果已经创建了default怎么办?

//1.进入default
docker-machine ssh default

//2.更换地址
sudo sed -i "s|EXTRA_ARGS='|EXTRA_ARGS='--registry-mirror=你的阿里云镜像加速地址 |g" /var/lib/boot2docker/profile  

//3.退出
exit

//4.重启镜像源
docker-machine restart default

//5.验证是否已更换
docker info

更换成功示意图:

 tips:如果你的电脑是win7且你的电脑登录账户不是系统管理员,那么要么换win10电脑,要么把电脑砸了,因为后面是无限的坑。。。

5.Docker常用命令

docker的命令都是以docker开头 

容器创建:

  • run:创建容器
  • -p:映射宿主机的端口给镜像服务使用
  • -v:挂载宿主机的文件目录到镜像里面
  • -it:提供交互式的终端工具
  • -d:是让镜像容器在后台去持续运行
  • --name:指定容器的名称
  • exec:进入到容器里面

示例:

//创建一个root密码为123456的mysql版本为5.7的端口映射到8000,且取名为 mysql5.7test01的容器
docker run -p 8000:3306 -e MYSQL_ROOT_PASSWORD=123456 -itd --name mysql5.7test01 mysql:5.7

容器操作:

  • start:启动
  • stop:停止
  • restart:重启
  • rm:删除已停止容器(未停止不可删除)
  • ps:查看正在运行的容器的状态
  • ps -a:-a参数来查看所有的已经运行的容器(无论是否停止)

示例:

docker ps -a


docker rm mysql5.7test
或
//docker rm 容器id

镜像操作(镜像部分涉及到仓库的操作,仓库操作类比Git命令即可):

前提:docker hub上注册docker账号:Docker Hub

  • login:仓库登录
  • pull: 拉取镜像
  • commit:提交镜像
  • push:推送镜像
  • 补充commit/pull/push:每个操作需要给一个标签:tag
  • images:查看本地所有镜像
  • rmi:删除本地镜像(删除前需要停止并删除依赖该镜像的容器,否则删除失败)

示例:

docker commit <container_id> <namespace>/<image_name>:tag
docker pull/push <namespace>/<image_name>:tag

//如:
docker commit tr8yt89yty xxxx/mysql:5.7


//推送
docker push tomcat:8

6.Dockerfile

用于构建镜像

7.Docker-compose 

定义一个多容器的应用

6,7因电脑原因暂停 

EMS案例:BMS传导发射超标整改案例 BMS作为新能源汽车的关键部件,其EMC性能直接影响整车的安全性和可靠性。本文通过一个实际的传导发射整改案例,详细展示了从问题定位、分析到解决方案实施的全过程。希望这些经验能够为从事类似产品设计的工程师提供有价值的参考,在未来的产品开发中避免类似问题,设计出更加可靠、稳定的BMS产品。EMC设计是一门结合理论与实践的艺术,只有通过不断积累经验、深入理解电磁场理论,并紧密结合实际应用场景,才能在复杂的电磁环境中设计出鲁棒性强的电子产品。 阅读详情

相关推荐

汽车氛围灯 PCBA 方案开发:从技术底层解析车载光效的核心逻辑

摘要: 车载氛围灯PCBA方案开发需兼顾性能与车规要求。主控芯片选型应关注运算能力、温度适应性和低功耗(如NXPS32K344、复旦微FM33FG065A)。电路防护需采用TVS二极管等组合设计,满足ISO7637-2浪涌防护标准。通信协议分层应用(CAN+LIN),调光需解决色准与温漂问题,动态灯效通过FIFO队列实现。开发中需进行温度循环、振动、EMC等可靠性测试,细节处理(如三防涂覆)至关重要。该领域开发需熟悉车规标准并积累实车经验。

2401_87454052的博客 1132

前端工程化精讲第二十一课 容器方案:从构建到部署,容器化方案的优势有哪些?

容器化(Containerization)通常是指以Docker技术为代表,将操作系统内核虚拟化的技术。和传统的虚拟机相比,容器化具有占用空间更小、性能开销更低、启动更快、支持弹性伸缩以及支持容器间互联等优势。下面介绍 Docker 的几个基本概念。这节课我们首先了解了以 Docker 为代表的容器化技术的基本概念:镜像、容器、数据挂载和网络等。然后讨论了容器化的构建部署需要经历的流程,先创建镜像,然后根据镜像创建容器,最后在容器内执行相关部署环节。...

fegus的博客 1174

数字后端零基础入门系列 | Innovus零基础LAB学习Day9

数字后端零基础入门系列 | Innovus零基础LAB学习Day9

weixin_37584728的博客 4582

超详细:30分钟入门docker前端容器化

前端利用docker进行容器化实战记录

一步一个脚印 3471

IgH EtherCAT 从入门到精通:第 2 章 环境搭建与编译安装

环境搭建与编译安装指南 本章详细介绍了搭建IgH EtherCAT Master开发环境的完整流程。内容包括: 硬件要求:支持多种Intel和Realtek网卡的原生驱动,以及通用网卡的generic驱动选项 软件依赖:列出Linux系统下所需的工具链和开发包 源码获取:通过Git克隆官方仓库并切换稳定版本的方法 配置选项:详细解析bootstrap脚本和configure的核心参数,包括路径设置、功能开关和实时框架选项 编译流程:从生成构建系统到最终编译安装的完整步骤 通过本章指导,读者可以完成一个可运行

从事嵌入式linux android驱动开发,拥有全栈能力 481

【AI智能体】Codex 高级进阶使用技巧项目实战操作详解

Codex 高级进阶使用技巧项目实战操作详解

congge 1万+

前端 VUE 项目容器化方案 - 总有一款适合你

服务,且每次更新的前端资源都以镜像中的资源为准(每次重启容器,宿主机的资源都会被容器中的资源所覆盖),非必要无需挂载资源到宿主机。作为反向代理,且每次更新的前端资源都以镜像中的资源为准(每次重启容器,宿主机的资源都会被容器中的资源所覆盖),只需要将容器中的资源挂载到宿主机。作为反向代理,且每次更新的前端资源都以镜像中的资源为准(每次重启容器,宿主机的资源都会被容器中的资源所覆盖),只需要将容器中的资源挂载到宿主机。配置文件建议由运维统一管理,以免研发的配置版本和生产于运维的存在冲突的情况。

Rambo's Blog 1347

XGBoost原生接口和Sklearn接口参数详解

XGBoost原生接口和Sklearn接口参数详解

算法工程师 2656

小而强大:通过容器化应用实现前端微服务

采用前端服务化和小程序容器技术能够提供许多好处。通过将前端应用拆分为独立的小程序模块,并通过容器提供的接口和通信机制进行交互,我们可以实现前端应用的模块化、独立部署和扩展,以及松耦合的通信。

speedoooo的博客 756

C/C++炫酷烟花①(完整代码)

C/C++实现炫酷烟花动画的完整代码。

AIGC 2万+

【异常】飞书OpenClaw机器人 HTTP 401: Invalid Authentication 报错排查与解决方案

HTTP 401 是HTTP协议标准定义的未授权(Unauthorized)状态码,核心含义为请求方身份认证无效,服务端拒绝执行本次请求。飞书开放平台服务端对自建机器人的全链路鉴权校验失败。无论是机器人接收飞书事件推送的上行请求,还是机器人主动调用飞书开放平台API的下行请求,只要身份凭证无效、鉴权逻辑校验不通过,飞书服务端就会返回该报错,并最终透传到飞书客户端会话窗口中。

奶爸的编程之路,也就一周冷个三天 3765

使用Docker完成前端部署

使用Docker完成前端部署

m0_59757074的博客 5962

微信小程序 - 最新详细实现调起手机摄像头拍摄身份证人像面和国徽面取景框功能,在拍照相机上增加身份证证件照的轮廓或自定义文字,支持替换扫描拍摄辅助线图片及文本,小程序实现拍照身份证时带取景轮廓框拍摄!

微信小程序,身份证,证件照,人像,证件照提示框模板,vue身份证拍照框,摄像机相机里有引导内容,取景框拍摄,微信小程序实现拍照界面自定义实现,自拍人相框拍摄,取景框,户口簿取景框,画布指定区域生成图片,微信小程序身份证正反面拍照如何加入辅助图片引导照片,身份证取景框拍摄,服务器,上传,正反面,调起手机摄像头:拍摄身份证的正反面,自定义身份证取景框,在相机上绘制“身份证轮廓“与提示文字,拍摄身份证时出现人像框怎么实现,在相机上增加图片和文字,微信小程序怎么给调起的相机加入自定义图片,小程序实现给相机上面

🏆 前端领域优质创作者 1万+

一文学懂Docker——从快速入门到项目部署

本文章目的是一文学懂Docker,从最基础的Docker开始了解,从快速入门到实际应用项目部署;包含docker基础、docker如何部署容器、docker数据卷如何挂载、Dockerfile基础语法、docker自定义镜像、docker网络自定义、docker部署java应用、DockerCompose部署多服务项目

九离的博客 1392

Camera2Demo

在Camera2 的基础上进行封装,使得Camera2一堆初始化逻辑与Activity分离,降低耦合度,完成预览拍照并保存的操作

win10 跳过U8环境检测的IE WebControls.rar

win10 安装u8的时候 提示IE WebControls 不通过,这个工具可以欺骗u8的检查。 跳过U8环境检测的IE WebControls。提示导入失败后,重新检测通过。

【网络监控】Zabbix 7.4 容器化部署实战(Docker Compose 一站式)

本文详细介绍了使用Docker Compose容器化部署Zabbix 7.4的实战指南,包括环境准备、Compose文件编写、服务启动与初始化等关键步骤。通过容器化部署,可实现环境隔离、快速回滚和资源控制,大幅提升Zabbix监控平台的部署效率和稳定性。文章还提供了性能调优、数据持久化验证等高级配置技巧,帮助用户快速搭建企业级监控系统。

anjueci1221的博客 428

LinePhone3.2.7(android端最新版本) sip客户端

SIP客户端For android:LinePhone3.2.7(最新版本),官网地址:http://www.linphone.org/

如何用 Docker 五分钟搭好 DeepTutor:AI 学习助手容器化部署指南

想跑 AI 学习助手的人看这篇:用 Docker Compose 把 DeepTutor 一键部署进容器,前端、后端、知识库几分钟起服。按环境自检、三步启动、验证、运维的顺序走,命令复制即跑。 ## 环境自检 开跑前花十秒确认三样,缺哪个补哪个: - **Docker Engine(≥ 20.10)**:`docker --version` 看一眼,没有就先装 Docker。 - **Doc

gitblog_00118的博客 446

VB摄像头监控

该VB模块可对摄像头捕获的画面进行录像等,可在创建的窗口进行控制

用Streamlit+FastAPI打造机器学习应用:从本地调试到Docker部署全流程

本文详细介绍了如何利用Streamlit和FastAPI构建机器学习应用的全流程,从本地调试到Docker部署。通过汽车评估案例,展示了前后端分离架构的设计与实现,包括环境准备、API开发、前端界面设计以及容器化部署。文章还涵盖了性能优化、安全实践和持续集成等高级主题,为开发者提供一站式解决方案。

m5n6o7的博客 772

3 步用 Docker 稳定部署 DeepTutor 学习助手:一条命令跑通你的 AI 导师

给项目装依赖装到崩溃,只想一条命令把它跑起来?DeepTutor 就是为这种需求准备的:一个 Agent 原生的个性化学习助手,AI 导师、知识库、题库开箱即用。用 Docker Compose 部署它,宿主机不用装 Python 和前端工具链,几分钟就能得到一个稳定可用的学习环境。 ## 🐳 为什么值得用 Docker 部署 环境在容器里,宿主机干干净净,Python 版本冲突与你无关;镜

gitblog_00161的博客 821

七、Docker 容器 + Docker Compose单机部署理发店系统

docker+docker自定义网络 和 docker+docker compose;"手动拼积木" vs "按图纸一键组装"。对于部署一个包含后端、数据库、缓存等多服务的理发店系统,使用docker手动管理,和用编排,体验和效率会有天壤之别。对比维度纯 Docker 命令 (docker + docker network)工作方式命令式,手动逐条输入指令。声明式,在文件中定义所有服务。配置管理配置分散在命令行参数中,难以记录和复用。

weixin_39698240的博客 275

DeepTutor Docker 部署:一条命令启动全功能 AI 学习助手

三条命令,首跑约十分钟,你得到的是一个跑在 `http://127.0.0.1:3782` 的完整服务:能和它对话、往知识库喂资料、让 AI 帮你出学习材料。整套容器化部署由 compose 托管,包含主服务、沙箱 runner、认证旁车共三个容器。 [![DeepTutor Docker 部署架构示意](https://raw.gitcode.com/GitHub_Trending/dee/D

gitblog_00381的博客 1029

前端转后端实战指南:从Spring Boot接口到Docker部署

前后端分离开发模式已成为现代Web工程的主流,其核心在于通过HTTP接口实现前端展示与后端逻辑的解耦。理解后端工作原理,关键要掌握接口如何设计、数据如何持久化、登录态如何鉴权以及服务如何部署上线。基于Spring Boot的Java技术栈,因其生态成熟、岗位需求稳定,成为前端开发者切入后端的高效路径。通过RESTful接口规范、统一响应体、Token鉴权机制,可以快速搭建可靠的服务端能力。同时,利用Docker容器化技术,将前端构建产物与后端应用打包编排,能够解决环境一致性与一键部署的难题。面对跨域请求、参

weixin_29284201的博客 264

前端开发者后端与部署Skill选型指南:从Node.js到Docker实战

前后端分离架构中,前端开发者常面临接口联调与部署上线的工程瓶颈。Node.js凭借JavaScript语言一致性,成为前端切入后端接口服务的最短路径,配合Express或Koa可快速实现RESTful API与JWT鉴权。部署层面,Nginx反向代理与Docker容器化打包解决了静态资源托管和环境一致性问题,使前端具备独立上线能力。在中小型项目实战、BFF层构建及快速迭代场景中,这套选型方案投入产出比最高。掌握Node.js后端与Docker部署Skill,是前端突破职业边界的关键。

weixin_32183107的博客 199

前端开发者必补的后端与部署选型指南:从Node.js到Docker

前后端分离架构下,前端开发者需要理解后端服务与部署流程。后端本质是处理HTTP请求、路由、数据库与鉴权,部署则是将代码运行在可访问的服务器环境。掌握这些能力可独立交付全栈应用,避免联调与上线时的常见障碍。典型场景包括接口开发、跨域处理、Nginx反向代理与容器化部署。本文围绕前端开发者如何选择Node.js、Python或Java后端,以及手动、Docker、平台化部署方案,提供可落地的选型与实操参考。

weixin_32520095的博客 185

机器学习模型部署指南

如今,掌握模型部署已经成为数据科学家的必备技能,许多雇主也期待数据科学家具备这方面的能力。因此,无论是初学者还是有经验的从业者,都应该掌握如何将机器学习模型部署到生产环境。本文将介绍如何将机器学习模型部署到生产环境,让我们开始吧!

Xianxiancq的博客 801

Vue3前端项目Docker容器化部署工作报告

项目采用Vue3+TS+Vite技术栈,通过Docker和Nginx实现生产级部署方案

qq_45161108的博客 1333

通过 Docker 实现前后端的容器化部署

介绍如何使用Docker实现前后端的容器化部署(Vue / Spring Boot)

m0_73310000的博客 1939
上一篇: vscode常用插件(个人)
下一篇: 【vue】配置cdn加速
谭CV
博客等级 码龄9年 73粉丝 85原创
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值