当前位置: 移动技术网 > IT编程>开发语言>JavaScript > 用React写一个工大导航

用React写一个工大导航

2019年06月01日  | 移动技术网IT编程  | 我要评论

online:
github地址:

笔者在广工读书这几年, 总的来说是快乐地生活, 不过生活之中也有一些烦恼存在着, 比如去校医院看病却不知道门诊的时间, 想要知道教学日历, 每次都要询问同学等等. 这些事情虽然是小事小问题, 但是它们不止一次地困扰着我. 为此, 我决定利用我大学本科学到的知识来解决这些问题.

问题的解决之道就是设计并开发一个广东工业大学导航网页.

内容

gdut-nav(工大导航)聚合了很多校内校外的站点链接, 也收集了许多方便, 有趣的工具/游戏.

校内导航: 可以通过工大导航访问查看教学日历, 查询校医院门诊时间, 校园网续费等等
校内导航

网站集合
网站集合

工具集合
工具集合

游戏集合: 工大导航同时也收录了一些有趣好玩的在线游戏, 在室内如果想放松却又不知道做什么的时候, 不妨打开工大导航, 访问并体验一把游戏.
游戏集合

技术

整个项目开发实现起来较为简单, 可以当做一个学习前端开发技术入门的练手项目

页面设计主要参考借鉴了https://github.com/ice-hazymoon/mikutools的界面

运用到的技术/工具主要有react/webpack/iconfont/es6/css/html

本项目能够适配pc端和移动端, 移动端界面效果如下:
工大导航移动端

项目目录结构如下:

│  app.js
│  index.js
│  
├─api
│      db.js
│      
├─components
│      header.jsx
│      nav.jsx
│      search.jsx
│      
└─static
    ├─css
    │      index.scss
    │      reset.scss
    │      
    ├─iconfont
    │      iconfont.css
    │      iconfont.eot
    │      iconfont.svg
    │      iconfont.ttf
    │      iconfont.woff
    │      iconfont.woff2

如对本文有疑问, 点击进行留言回复!!

相关文章:

验证码:
移动技术网