码农知识堂 - 1000bd
  •   Python
  •   PHP
  •   JS/TS
  •   JAVA
  •   C/C++
  •   C#
  •   GO
  •   Kotlin
  •   Swift
  • github在线编程


    github在线编程

    文章目录

    • github在线编程
      • 两种区别
      • 演示项目 Ruoyi-Vue
      • GitHub Codespaces 演示
        • github 访问项目
        • 使用 GitHubCodeSpace 打开该项目
        • 查看运行环境
        • 安装运行环境
        • 初始化myql数据
        • 安装 redis
        • 运行前端
        • 运行后端
        • 前后端运行成功测试
        • 安装相关插件
      • GitPod 演示

    说明:

    目前总结 github 开箱即用的集成环境 , 有 2 种方式比较好用

    • GitPod
    • GitHub Codespaces

    两种区别

    参考网址:

    https://devpress.csdn.net/cloudnative/62fb6d967e6682346618e9f0.html

    演示项目 Ruoyi-Vue

    项目 github 地址

    https://github.com/yangzongzhuan/RuoYi-Vue

    项目文档地址:

    http://doc.ruoyi.vip/

    运行环境

    • jdk1.8
    • maven
    • mysql
    • redis
    • node

    GitHub Codespaces 演示

    github 访问项目

    image-20230520125506839

    使用 GitHubCodeSpace 打开该项目

    image-20230520125537595

    初始化在线编程环境 , 如下图所示

    image-20230520125828193

    image-20230520131041846

    查看运行环境

    • maven

    • node

    • jdk (jdk版本默认是17 , 切换到 jdk1.8)

    • mysql (初始化没有, 使用docker安装)

    • redis (初始化没有, 使用docker安装)

    image-20230520131323335

    安装运行环境

    修改 jdk 版本为 jdk1.8

    参考网址:

    https://cloud.tencent.com/developer/article/1551638

    使用 sdkman 管理 jdk 版本

    • 查看可以安装的 jdk 版本
    sdk list java
    
    • 1

    image-20230520131704594

    • 安装 jdk1.8
    sdk install java 8.0.352-amzn
    
    • 1

    image-20230520131912980

    image-20230520131943493

    image-20230520132057382

    image-20230520132124480

    到此 切换 jdk 1.8 成功

    初始化myql数据

    初始化 mysql 的数据

    mysql 脚本 在 sql 目录下

    image-20230520131200088

    初始化两个脚本即可

    使用 docker 安装 mysql

    docker run --name some-mysql -e MYSQL_ROOT_PASSWORD=root -d mysql:5.7
    
    • 1

    测试运行 mysql

    image-20230520133056745

    导入sql 脚本

    拷贝脚本 到 mysql 容器中 some-mysql

    docker cp sql  some-mysql:/root/
    
    • 1

    容器内部查看 sql 脚本已经复制到 /root/sql 目录下

    image-20230520134131832

    创建数据库

    说明:

    修改数据库名称 ry-vue 改为 ry_vue , 在命令行的情况下 , 使用 ry-vue名称创建会报错 ;

    image-20230520134335146

    使用 source 命令导入对应数据

    安装 redis

    docker run -p 6379:6379 --name redis \
    -v /mydata/redis/data:/data \
    -d redis:5 redis-server --appendonly yes \
    --requirepass "root" 
    
    • 1
    • 2
    • 3
    • 4

    运行前端

    安装依赖

    # 进入前端目录
    cd ruoyi-ui 
    # 安装依赖
    npm install --registry=https://registry.npmmirror.com 
    
    • 1
    • 2
    • 3
    • 4

    image-20230520135201753

    运行项目

    npm run dev
    
    • 1

    安装失败 , 因为 node 版本太高 , 我们切换到 低版本的 node

    使用 nvm 安装 node 12

    # 列出 node 版本
    nvm list
    # 安装 node 12
    nvm install 12.22.12
    
    • 1
    • 2
    • 3
    • 4

    image-20230520140942902

    安装完成

    查看 node 和 npm 版本

    node -v
    npm -v
    
    • 1
    • 2

    image-20230520141015025

    重新安装依赖和运行项目

    image-20230520141501449

    运行成功

    打开前端页面

    image-20230520141539111

    image-20230520141619388

    运行后端

    修改配置

    logback.xml

    image-20230520185752059

    application.yml

    修改 reids 连接信息

    image-20230520185852492

    application-druid.yml

    修改 mysql 连接信息

    image-20230520185948705

    安装依赖

    mvn clean package
    
    • 1

    运行项目

    java -jar ruoyi-admin/target/ruoyi-admin.jar 
    
    • 1

    运行中…

    image-20230520190211676

    image-20230520190225189

    后端运行成功

    image-20230520190247312

    前后端运行成功测试

    后端

    image-20230520190314474

    前端

    image-20230520190331000

    访问

    image-20230520190414535

    登录界面

    image-20230520190435378

    登录成功

    image-20230520190500716

    安装相关插件

    中途安装了一些插件

    如下图所示

    到此 Ruoyi-Vue 项目搭建安装完成

    GitPod 演示

    其余通 GitHubCodeSpace , 打开方式不一样

    https:// 后面加上 gitpod.io#

    image-20230520190830870

    image-20230520190842669

    image-20230520190900751

    image-20230520190924526

    其余步骤 GithubCodeSpaces

  • 相关阅读:
    uni-app vuex全局计时
    nginx共享内存机制详解
    使用 gitignore 忽略 UserInterfaceState.xcuserstate
    页面测试包括哪些内容?方法和要点有哪些?
    Linux入门之优化 systemd 以缩短开机时间
    SpringMVC笔记——SpringMVC配置类取代xml配置
    使用Tensorboard碰到AttributeError: module ‘distutils‘ has no attribute ‘version‘
    Java面试题及答案
    VSFTP服务简介
    Perl时间处理函数用法介绍
  • 原文地址:https://blog.csdn.net/shaoming314/article/details/130813927
  • 最新文章
  • 攻防演习之三天拿下官网站群
    数据安全治理学习——前期安全规划和安全管理体系建设
    企业安全 | 企业内一次钓鱼演练准备过程
    内网渗透测试 | Kerberos协议及其部分攻击手法
    0day的产生 | 不懂代码的"代码审计"
    安装scrcpy-client模块av模块异常,环境问题解决方案
    leetcode hot100【LeetCode 279. 完全平方数】java实现
    OpenWrt下安装Mosquitto
    AnatoMask论文汇总
    【AI日记】24.11.01 LangChain、openai api和github copilot
  • 热门文章
  • 十款代码表白小特效 一个比一个浪漫 赶紧收藏起来吧!!!
    奉劝各位学弟学妹们,该打造你的技术影响力了!
    五年了,我在 CSDN 的两个一百万。
    Java俄罗斯方块,老程序员花了一个周末,连接中学年代!
    面试官都震惊,你这网络基础可以啊!
    你真的会用百度吗?我不信 — 那些不为人知的搜索引擎语法
    心情不好的时候,用 Python 画棵樱花树送给自己吧
    通宵一晚做出来的一款类似CS的第一人称射击游戏Demo!原来做游戏也不是很难,连憨憨学妹都学会了!
    13 万字 C 语言从入门到精通保姆级教程2021 年版
    10行代码集2000张美女图,Python爬虫120例,再上征途
Copyright © 2022 侵权请联系2656653265@qq.com    京ICP备2022015340号-1
正则表达式工具 cron表达式工具 密码生成工具

京公网安备 11010502049817号