前后端分离开发实战经验
前后端分离不仅是技术架构的改变,更是团队协作模式的革新。本文总结实战中的关键点。 一、前后端分离的本质 1.1 传统 JSP/Thymeleaf 模板时代的痛点 1.2 分离后的职责边界——前端负责渲染,后端负责数据 1.3 RESTful API 是前后端的”合同” 二、接口规范先行 2.1 Swagger / YApi 统一管理接口文档 2.2 接口 Mock 数据——前端不阻塞 2.3 版本管理——/api/v1/ 策略 三、跨域问题解决 3.1 什么是跨域——同源策略 3.2 开发环境——Vue DevServer Proxy 3.3 生产环境——Ng...
Webpack 构建工具入门
从手写 script 标签到模块化构建,Webpack 是前端工程化的核心工具。本文带你理解它解决了什么问题。 一、为什么需要构建工具 1.1 远古时代——全局脚本与命名冲突 1.2 模块化——CommonJS / ES Module 1.3 浏览器不认识 require / import 1.4 Webpack 的角色——打包+转换 二、核心概念 2.1 Entry——入口起点 2.2 Output——输出配置 2.3 Loader——文件转换器 2.4 Plugin——功能扩展 2.5 Mode——开发/生产模式 三、常用 Loader 3.1 ...
Axios 封装与接口管理
前后端分离后,HTTP 请求的管理变得至关重要。一个好的 Axios 封装能显著提升开发效率和代码可维护性。 一、Axios 基础 1.1 安装与引入 1.2 GET / POST / PUT / DELETE 请求 1.3 请求配置项——headers、params、timeout 1.4 响应数据结构 二、创建 Axios 实例 2.1 axios.create() 创建独立实例 2.2 配置 baseURL——区分环境 2.3 设置默认 timeout 和 headers 三、请求/响应拦截器 3.1 请求拦截——自动添加 Token...
Vuex 状态管理入门
当多个组件共享同一份数据时,props 和 EventBus 开始力不从心。Vuex 提供了集中式的状态管理方案。 一、什么是状态管理 1.1 组件内部状态 vs 应用级状态 1.2 多组件共享数据的痛点 1.3 Vuex 的解决思路——单一数据源 二、核心概念 2.1 State——单一状态树 2.2 Getter——计算属性 2.3 Mutation——同步修改 State 2.4 Action——异步操作后提交 Mutation 2.5 Module——模块化拆分 三、一个购物车示例 3.1 定义 State——商品列表、购物车 3.2 Mutation——添加/...
Vue Router 路由管理
单页应用(SPA)的核心是前端路由。Vue Router 让页面切换变得像后端路由一样自然。 一、SPA 与前端路由 1.1 传统多页应用 vs 单页应用 1.2 Hash 模式与 History 模式的区别 1.3 #/xxx vs /xxx 的原理 二、基本配置 2.1 安装与引入 Vue Router 2.2 定义路由表——path + component 2.3 <router-view> 渲染出口 2.4 <router-link> 导航链接 三、动态路由 3.1 /user/:id 动态路径参数 3.2 $route.params 获取参数 3...
Vue 组件通信方式
组件化开发中,组件之间的数据传递是最常见的需求。本文梳理 6 种通信方式及其适用场景。 一、props / $emit(父子通信) 1.1 父组件通过 props 向子组件传值 1.2 子组件通过 $emit 触发父组件事件 1.3 .sync 修饰符的语法糖 二、$refs / $parent / $children 2.1 $refs 获取子组件实例 2.2 $parent 访问父组件 2.3 局限性——耦合度高 三、EventBus(兄弟组件通信) 3.1 创建一个空的 Vue 实例作为事件中心 3.2 $on 监听事件、$emit 触发事件 ...
Vue.js 快速上手
从 jQuery 到 Vue,前端开发的思维方式发生了根本变化。本文用最简短的篇幅带你理解 Vue 的核心概念。 一、MVVM 模式简介 1.1 jQuery 时代的 DOM 操作 1.2 数据驱动的思想——数据变了,视图自动更新 1.3 Vue 的 MVVM 三层——Model / View / ViewModel 二、创建第一个 Vue 实例 2.1 CDN 引入 Vue.js 2.2 new Vue({ el, data, methods }) 基本结构 2.3 {{ }} 插值表达式 2.4 v...
Android 网络请求与数据解析
App 的本质是数据+界面。网络请求是连接 App 与服务端的桥梁,掌握它是每个 Android 开发者的基本功。 一、Android 网络请求基础 1.1 主线程不能做网络请求——NetworkOnMainThreadException 1.2 AsyncTask 的基本使用 1.3 权限声明——INTERNET 二、HttpURLConnection 原生方式 2.1 发起 GET 请求 2.2 发起 POST 请求 2.3 读取响应流 2.4 原生方式的优缺点 三、OkHttp 库的使用 3.1 OkHttp 的引入与基本配置 3.2 同步请求 vs 异步请求 3.3 拦截...
Android 四大组件入门
Android 开发的入门第一课就是理解四大组件。本文聚焦最核心的 Activity 和 Fragment。 一、Android 四大组件概述 1.1 Activity——用户界面 1.2 Service——后台服务 1.3 BroadcastReceiver——广播接收 1.4 ContentProvider——数据共享 1.5 组件之间的关系 二、Activity 生命周期 2.1 onCreate / onStart / onResume / onPause / onStop / onDestroy 2.2 生命周期流转图示 ...