demo
关注
分享
扫一扫
文章平均质量分 83
火星飞鸟
学习前端ing...
展开
-
在校学生课余时间用React肝出一款个人博客系统，前台+后台管理，求指点
1. 前言之前我使用hexo搭建过个人博客。hexo很强大，渲染页面速度快，支持markdown语法，可以一键部署，还可以扩展各种插件。但hexo搭建的是静态页面，每次更新文章，都要重新生成静态页面，再部署页面。hexo也没有后台管理，想要修改发布的文章，只能修改源代码，再重新生成页面。所以很早之前就想写一个自己的博客系统，由博客展示页面和后台管理页面构成，通过后台管理页面，可以实时更新、发布文章，非常方便。但在当时还没有能力写出这样一个系统，就一直没有去做。后来学习了React之后，想尝试下写自己的原创 2021-08-25 09:47:05 · 1245 阅读 · 6 评论 -
【看后必会】一步步教你用React写一个markdown实时编辑器！
1. 实现效果最近在用React写一个博客管理系统，有一个功能是添加新文章。在新建文章的页面，我希望做到像CSDN这样，左边是编辑区（markdown格式），右边是预览区。实时更新，编辑文本的同时，在预览区就能看到效果。就自己动手实现了一个这样的组件，markdown实时预览编辑器！具体效果如下：2. 实现过程使用React实现，做成单独的一个组件。首先HTML结构如下：<header>基于React的markdown实时编辑器</header><div cl原创 2021-07-05 18:14:33 · 1839 阅读 · 7 评论 -
阿里云部署，基于React、C/C++，使用TCP/HTTP协议的多人聊天室Web应用
1. 前言最近和后端同学I’M渣渣一起完成了一个Demo级的多人聊天室应用，实现了聊天室的基本功能。采用前后端分离方案，我负责前端代码的编写，I’M渣渣实现了后端的接口。预览地址：多人聊天室源码仓库：[GitHub]2. 应用简介主要功能用户注册用户登录发送、接收消息退出功能主要用到的技术前端：React脚手架Create-React-App状态管理redux + react-redux等前端路由 React-Router、路由鉴权少量使用 AntD 组件库 （Ic原创 2021-06-01 20:58:09 · 1571 阅读 · 11 评论 -
一款使用React、腾讯云开发的TodoList待办事项Web应用
1. 前言最近写了一款基于React脚手架开发的 TodoList 网页应用，主要记录自己的代办事务，方便查看、管理、安排时间，提升效率。PC Web端 + 移动端 + 黑暗模式，可日常使用。没有复杂的界面，没有繁琐的设置，开箱即用，专注于任务管理。应用网址：TodoList2. 应用简介1. 主要功能邮箱注册、登录注册邮箱地址、密码的验证邮箱登录后，可绑定用户名，选择使用用户名登录同一账号退出功能页脚显示一句诗词（今日诗词）实时时间显示黑暗模式、白天模式切换，下次登录自动切换上原创 2021-05-22 12:29:45 · 860 阅读 · 4 评论 -
TypeScript 面向对象实现的贪吃蛇小游戏
1. 游戏效果[→点击此处预览效果←]方向键控制蛇的移动方向蛇吃到食物后，身体多出一格，分数+1，食物重新刷新位置最大等级为9级，每3分升一级，升级后蛇的移动速度增加若蛇撞到边界或撞到自己，则游戏结束刷新页面后游戏重新开始2. 实现方法贪吃蛇小游戏用TypeScript编写，HTML骨架和CSS样式部分比较简单，很多方法都可以实现效果，这里就说一说TS的实现思路。因为小游戏比较简单，所以没用使用webpack等打包，直接写将TS编译后的JS文件引入页面。TS部分运用了面向对象的编程思原创 2021-03-23 13:18:09 · 379 阅读 · 2 评论 -
基于vue-router的小练习——后台管理系统
1. 练习到的技术点路由的基础用法嵌套路由路由重定向路由传参编程式导航2. 实现效果3. 实现代码<!DOCTYPE html><html lang="Zh"><head> <meta charset="UTF-8" /> <title>基于vue-router的案例</title> <style> html, body, #原创 2020-12-08 19:49:27 · 571 阅读 · 0 评论 -
基于Vue组件化开发的购物车小练习
实现效果：实现代码：<!DOCTYPE html><html lang="Zh"><head> <meta charset="UTF-8"> <title>Document</title> <style> .container .cart { width: 300px; margin: auto; }原创 2020-12-02 19:45:26 · 286 阅读 · 1 评论 -
基于Vue的TAB栏切换小练习
实现效果：实现代码：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>TAB选项卡</title> <style> .tab u原创 2020-11-30 15:10:51 · 303 阅读 · 1 评论 -
基于Vue的增、删、改小练习——图书管理
实现效果：实现对图书的增、删、改等操作页面刷新，编号输入框自动获取鼠标焦点当点击修改按钮时，禁止修改图书的编号计算图书的总数，动态显示在页面添加或修改图书，图书名重复时，禁止提交格式化显示时间实现代码：<!DOCTYPE html><html lang="Zh"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-w原创 2020-12-01 20:18:05 · 353 阅读 · 0 评论 -
基于jQuery的仿IOS14计算器
实现效果：[→点击此处预览效果←]点击Calculator按钮，打开计算器。打开计算器后，左边一栏是对于键盘操作的提示信息。按住计算器顶部并移动，可以实现拖拽计算器功能。实现了计算器的基本计算功能。计算器显示数字的区域，当数字过多时，自动缩小字体以显示全部的数字。点击计算器右上角的×，关闭计算器。存在的BUG：因本人水平、时间有限，计算器存在一些BUG显示0.1+0.2=0.30000000000000004，精度问题未解决。没有键盘按下的显示效果。键盘按下的显示效果应与鼠标原创 2020-11-30 21:28:43 · 447 阅读 · 2 评论