【狂神说】分析前后端分离开源项目?
文章目录
- 1.如何分析开源项目
- 项目简介
- 项目源码
- 2.观察开源项目
- 3.开源项目下载
- 4.跑起来是第一步
- 5.前后端分离项目固定套路
- 6.如何找到一个开源项目
1.如何分析开源项目
学习的方式:
- 不知道这个代码怎么来的
- 这个代码跑不起来
- 这个项目对我们有什么帮助,不会模块化分析
任何一个开源项目,都可以让自己等到提升
代码自动生成:我们平时会写很多业务代码,用Mybatis Plus去生成的,第三方的工具包去生成
开源项目:eladmin
项目简介
一个基于 Spring Boot 2.1.0 、 Spring Boot Jpa、 JWT、Spring Security、Redis、Vue的前后端分离的后台管理系统
开发文档: https://el-admin.vip
体验地址: https://el-admin.xin
账号密码: admin / 123456
项目源码
后端源码 | 前端源码 | |
---|---|---|
github | https://github.com/elunez/eladmin | https://github.com/elunez/eladmin-web |
码云 | https://gitee.com/elunez/eladmin | https://gitee.com/elunez/eladmin-web |
2.观察开源项目
后端:
前端:
3.开源项目下载
在码云下载,因为GitHub下载太慢了,下载完毕进行解压
解压完不要着急运行
先去观察项目:
1、用了哪些技术(Springboot、Vue、Redis、MQ…)
2、是否有数据库
3、你的环境是否匹配(Maven、(npm、node.js)、redis…)
需要的环境匹配了再想办法运行
4.跑起来是第一步
1、安装数据库,执行SQL(先创建数据库,编码默认utf8)
2、前端跑起来(在文件上全选文件名然后cmd)
3、后端项目导入跑起来(打开idea——import)
4、等待所以的项目跑成功
6、启动后端项目(一般前后端分离项目,前端依赖于后端)
只要发现Swagger,就需要先把swagger跑起来,因为前后端分离的接口全部都在这里
进而查看配置文件,默认端口号,有哪些配置,需要改为自己的项目和环境地址!
(尤其是端口号和用户名密码)
前端:就是安装依赖。启动测试运行,看接口是否异常
打开Redis
开发环境重点需要去看端口号:server:port:8000(在总文件application.yml里面)前端也是调这个端口
第二个点需要去看Redis的端口号
开发环境dev.yml的JDBC没有问题
跑起来
进入页面:localhost://8000/swagger-ui.html
前端跑起来:(推荐VS Code打开文件夹)
5.前后端分离项目固定套路
1、从前端开始分拆,打开控制台,点一个接口,分析一波调用关系
2、前后端端口调用不一致:前端:8013 后端:8000;研究怎么操作的
封装了接口请求 ajax(前后端分离) axios(Vue) request(前端封装)
找到配置(生产配置、开发环境配置)
前后端分离项目的重点:找到接口的调用关系
Springboot提供服务、前端调用接口数据、Vue负责渲染页面
前端项目固定套路
通过抓取前端的请求,找到后端对应的接口
怎么去跟后端对接:
拿到接口的地址:
去后端找:
后端分析套路:Controller–Service–Dao
现在从前到后知道怎么分析了,但是如何渲染到视图上的呢?看前端
-Vue标准套路
template:视图层
script:js操作,接口的调用
style:页面的样式
- 如果你现在自己的项目或者要学习一个模块,将这个模块独立抽取出来即可,删除法
- 比如需要学习用户模块,除了了user模块
如果你想测试这个接口成不成功,在这里测一下,能不能把他查出来就行了
6.如何找到一个开源项目
layui
Semantic UI
Grabient
Vue Element Admin
1、找分类(Java、python)
2、看收藏(star),大家都觉得不错的,就是比较好的,有学习的价值
3、看具有价值
4、根据自身的理解情况:Java、SSM、Springboot…阶段性成果、
5、如何学习Java:Java进阶路线七个阶段
后端开发去写前端非常难看,可以使用第三方的:Ant Design Pro 或 Element
【狂神说】分析前后端分离开源项目?相关推荐
- gin+vue的前后端分离开源项目
该项目是gin+vue的前后端分离项目,使用gorm访问MySQL,其中vue前端是使用vue-element-admin框架简单实现的: go后台使用jwt,对API接口进行权限控制.此外,Web页 ...
- 前后端分离简单项目--蚂蚁博客--后端部分
原文网址:前后端分离简单项目--蚂蚁博客--后端部分_IT利刃出鞘的博客-CSDN博客 简介 说明 本文介绍我从0开发的前后端分离的简单项目--蚂蚁博客.本博文介绍后端部分. 本项目是 ...
- 视频教程-SpringBoot2+Vue+AntV前后端分离开发项目实战-Java
SpringBoot2+Vue+AntV前后端分离开发项目实战 10多年互联网一线实战经验,现就职于大型知名互联网企业,架构师, 有丰富实战经验和企业面试经验:曾就职于某上市培训机构数年,独特的培训思 ...
- JAVA外卖项目第九天 前后端分离和项目部署优化
瑞吉外卖项目优化-Day03 课程内容 前后端分离开发 Yapi Swagger 项目部署 前言 当前项目中,前端代码和后端代码混合在一起,是存在问题的,存在什么问题呢? 主要存在以下几点问题: 1) ...
- laravel + Vue 前后端分离 之 项目配置 - 开发环境
既然你来到查看这篇文章,那么你应该知道PHP 版本 >=7. 接着看一下目录 |-blog |-- api |-- front 目录外部很简单,,不多说了,赶紧看重点 配置Laravel 作为前 ...
- 前后端分离的项目部署到tomcat_如何在开发时部署和运行前后端分离的JavaWeb项目...
在开发中大型的JavaEE项目时,前后端分离的框架逐渐成为业界的主流,传统的单机部署前后端在同一个项目中的工程项目越来越少.这类JavaWeb项目的后端通常都采用微服务的架构,后端会被分解为诸多个小项 ...
- Element-UI + Vue.js + SpringBoot 实现前后端分离入门项目
Element UI 项目简介与演示 刷新页面时让组件默认为当前路由路径 删除时确认 分页功能的实现 el-date-picke 日期少一天 前端部分源码:https://github.com/szl ...
- 基于Springboot+vue前后端分离的项目--后端笔记
效果图: 1.前言 从零开始搭建一个项目最重要的是选择一个自己熟悉的框架,此项目使用Springboot框架来构建后端结构,使用vue来构建前端页面.数据层我们常用的是Mybatis,这里我大部分使 ...
- 视频教程-Angular+Django前后端分离实战项目开发教程-AngularJS
Angular+Django前后端分离实战项目开发教程 胜蓝博创(韬略课堂)创始人,IT培训讲师,先后在蓝港在线,热酷,乐元素等大型游戏公司任职,参与过多款大型网游.手游的设计和开发,精通页游.手游前 ...
最新文章
- CentOS5.4 上将Python进行升级,已经解决yum不可用的问题(转载)
- Ubuntu 16.04~ORB SLAM2~Kinect v1
- android 固定底部 布局_Android系统列表控件
- Hibernate基本概念 (3)
- React Native使用指南-植入原生应用
- 疫情风向标?苹果宣布将暂时关闭大中华区以外的所有苹果零售店!
- laravel blade include使用变量_3分钟短文:可能是Laravel模板最直白的用法了,没有之一...
- 发一个招聘软件开发人员的帖子
- 在CentOS6.9中搭建HBase
- App html5 本地化(Web App转为 Hybird app或新建一个 Hybird app)phonegap篇 (1) iOS
- 《tcpip详解卷一》:150行代码拉开协议栈实现的篇章
- 猿创征文|时间序列分析算法之平稳时间序列预测算法和自回归模型(AR)详解+Python代码实现
- 汇编语言指令用法大全
- 【Docker】给运行的容器添加端口映射
- windows bat更改系统时间 同步internet时间
- 部署Gbase 8c的系统要求
- 74HC245、74LVC245
- 8 岁小学生 B 站教编程惊动苹果,库克亲自送生日祝福!
- 时序分析(8) -- GARCH(p,q)模型
- 程序员必备5个编程自学网站,你都用到过吗?
热门文章
- 比特币Merkle树和SPV机制
- STL源码剖析 序列式容器 slist
- 使用openssl完成aes-cbc模式的数据加解密,输入和输出都是字符串的形式
- C++ primer 第14章 操作重载与类型转换
- 浅谈:国内软件公司为何无法做大做强?
- Oracle中修改遇到“ORA-00054: 资源正忙, 但指定以 NOWAIT 方式获取资源, 或者超时失效”
- WinForms多线程编程之摇奖程序
- RabbitMQ(三) 集群配置
- 移动互联网广告 - 第十更 - 广告投放运营 DashBoard - 2016/12/10
- zjnu1730 PIRAMIDA(字符串,模拟)