Giter Site home page Giter Site logo

hanghzhang / vite_react_blog Goto Github PK

View Code? Open in Web Editor NEW
1.0 1.0 0.0 5.86 MB

此项目为一个前后台分离的SPA项目，包括首页、文章管理、分类管理、个人中心等功能模块 。React18+ReactRouterDom6+Ant Design5 +Vite4+Echarts+mock等技术开发实现

HTML 0.27% CSS 2.51% JavaScript 92.50% Less 4.72%

vite_react_blog's Introduction

React项目-个人博客管理系统

项目描述

  1. 此项目为一个前后台分离的SPA项目
  2. 包括首页/文章管理/分类管理/个人中心等功能模块
  3. 技术栈：React18+ReactRouterDom6+Ant Design5 +Vite4+Echarts+mock等技术

项目亮点与难点

  • 针对项目需求，封装了多个自定义组件，其中包括自定义图标组件、上传图片预览及裁剪组件、组件懒加载等组件，不仅提高了项目开发效率,也使得项目更易维护。
  • 采用分片上传技术+MD5完成大文件上传功能，并实现断点续传及进度可视化。
  • 封装了同步获取状态数据的hook，使得在函数式开发下也能实现数据的即时响应。
  • 让函数式编程也具备componentWillMount生命周期函数特性，封装了对应的hook。
  • 优化Antd组件，结合防抖与节流，进一步提高Antd组件用户体验感及可视化效果。

项目功能界面展示

登录页面

image

首页

image

文章管理

image

image

分类管理

image

image

个人中心

image

image

404页

image

技术选型

image

前端路由

image

开源地址

https://github.com/HangHZhang/vite_react_blog

vite_react_blog's People

Contributors

hanghzhang avatar

Stargazers

avatar

Watchers

avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.