Code Monkey home page Code Monkey logo

c4media-test's Introduction

c4media-test

Budget account page

E-commerce work sample for C4Media

Features

Functional features

  • products list in / :
    • show product name, code, VAT, price (incl. VAT), quantity input & order button.
    • click on add to cart button add the quantity of product to the cart through ajax.
  • cart content in /cart :
    • show product name, code, unit price (incl. VAT), quantity input, total price (incl. VAT) & order button.
    • click on upodate cart button update the quantity of product in the cart through ajax.
  • cart widget on any page :
    • load cart information from server through ajax.
    • cart update generate notification (both for success & failure).

Frontend features

Backend features

  • products:
    • stored in database, imported from json file with php artisan db:seed.
    • linked to carts through cart_product table (with quantity in pivot table).
  • carts:
    • stored in database.
    • linked to products through cart_product table (with quantity in pivot table).
    • user's cart primary key is stored in session.
    • a REST API is served on /api/cart.

Missing frontend features

  • a "Remove product" button on product row in cart page (trigger a DELETE action on API).
  • move all Ajax call to a distinct component, for better scalability.
  • include all assets in front.js file and minimize it.
  • buttons '+' and '-' on quantity input in cart page.

Missing backend features

  • API parameters validation. Actually, parameters are not validated. It is not a security issue, but adding validation would provide relevant status code on failure (like incorrect quantity format).
  • import command for new products.
  • cleaning routine for old carts (when carts are too old for relevant statistics).

For production

Requirements

  • a web server (tested with Apache).
  • PHP >= 5.5.9
  • MySQL > 5.5
  • composer

Deployment

  • Get code base
cd /var/www/
git clone https://github.com/simondubois/c4media-test.git
cd c4media-test
composer install
  • Set up database
	cp .env.example .env
	php artisan key:generate
	# Then set values to the following keys in .env file :
	# DB_DATABASE (database name)
	# DB_USERNAME (mysql username)
	# DB_PASSWORD (mysql password)
	php artisan migrate --seed
  • Configure your web server to point to /var/www/c4media-test/public

Development

  • production requirements
  • nodejs >= 5.6.0
  • npm >= 3.6.0

Deployment

  • Follow production deployment

  • Install node packages

	npm install
  • Run webpack in watch mode for faster compilation
	./node_modules/.bin/webpack --watch

c4media-test's People

Contributors

simondubois 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.