Skip to content

Latest commit

 

History

History
47 lines (27 loc) · 1008 Bytes

README.md

File metadata and controls

47 lines (27 loc) · 1008 Bytes

项目描述

项目预览: https://success-cg.github.io/gallery-by-react/dist/

使用 react-webpack 脚手架制作一个图片画廊,点击中央图片会翻转显示背面的描述,点击四周图片,会把该图片移动到中央,其他图片重新随机排列。点击底部的控制按钮,同样可以操作对应的图片,进行翻转或居中

技术栈

  • react: 当下三大前端主流框架之一

  • webpack: 当下最流行的前端打包工具

  • scss: 高效快捷的预编译 CSS

  • autoprefixer: 自动添加 CSS 浏览器兼容前缀

  • es6 语法: 更加简洁高效

  • commonJS: 代码模块化,避免命名污染,便于维护

  • iconfont: 字体图标,更小更清晰,替代图片

环境搭建

npm install -g yo

npm install -g generator-react-webpack

项目构建

yo react-webpack

项目启动

git clone [email protected]:18810666595/gallery-by-react.git

cd gallery-by-react

npm install

npm run serve