Skip to content

murage-poc/E-Soko-UI-design

Repository files navigation

E-SOKO UI DEMO

Screenshot from 2020-03-12 23-58-01.png

A UI demo for a simple e-commerce site. Project architecture structure

.
|--- dist
|        |
|        |-assets
|        |   |
|        |   |-css 
|        |   |-images 
|        |   |-js 
|        |
|        |-index.html         
|
|---assets
|     |
|     |-sass 
|     |   |-app.sass 
|     |-images 
|     |-ts 
|        |-index.js
|
| index.html 
|     
| gulpfile.js
| package.json
| package-lock.json
| readme.md
| .gitignore

sass+typescript files are place under assets respective folders. The html pages are on the root project folder. The dist folder is autogenerated on build This can be modified in the gulpfile.js at the root folder.

BUILD MODULES INCLUDED
   "browserify": "^16.3.0",
    "gulp": "^4.0.2",
    "gulp-autoprefixer": "^6.1.0",
    "gulp-sass": "^4.0.2",
    "gulp-uglify": "^3.0.2",
    "tsify": "^4.0.1",
    "typescript": "^3.5.3",
    "vinyl-buffer": "^1.0.1",
    "vinyl-source-stream": "^2.0.0"

Prerequisites

  • Node js (with npm) installed
  • Git

Quickstart

  • Clone the project git clone https://github.com/mimidotsuser/E-Soko-UI-design.git.
  • Run npm install to load the dependencies
  • To build and continuously watch for changes using Gulp, run npm start
    • The project does not include any server. You will have to setup one which will serve the output in the dist folder