Git Product home page Git Product logo

tusharnankani / swadeshi Goto Github PK

View Code? Open in Web Editor NEW
21.0 2.0 6.0 22.65 MB

Implementing a Web Based solution through which farmers can participate in a commodity exchange market

Home Page: https://tusharnankani.github.io/Swadeshi/

License: GNU General Public License v3.0

CSS 14.53% HTML 25.87% JavaScript 59.35% Shell 0.25%
farmer farmer-portal wholesaler consumer website webapp javascript nodejs swadeshi user-interface

swadeshi's Introduction

Swadeshi

Problem Statement (TSEC Codestorm - Hackathon'20)

  • Implement a Web Based solution through which farmers can participate in a commodity exchange market. The solution should explain the process involved and the benefits of commodity exchange to the user.
  • The purpose of such an exchange is to provide a centralized marketplace where commodity producers can sell their commodities to those who want to use them for manufacturing or consumption.
  • The solution should enable farmers to create independent accounts and interact with dealers to avail the best profits and deals.

Tech Stack

  • Frontend

    • HTML5
    • CSS3
    • Vanilla JavaScript
  • Backend

    • Node.js (Express.js)
  • Database

    • MongoDB

For the Live Demo, click here.

  • The live demo replicates the behavior of the site without the need for a real server. Instead, there is a mock server that is implemented in client side JavaScript, using localStorage as the database.
  • Please refer to frontend/mock-server.js if you are curious about how the mock server is implemented.
  • To get a better understanding of how the site works, please open the developer console (Ctrl + Shift + J).
    The live demo logs a lot of details like network requests, responses and messages to the browser console.
  • The database can be inspected directly from the console by typing Database.tables.
    When the page is unloaded, the database is saved to localStorage with the key database. You can access this with localStorage.database.
  • Since this is just a prototype, there isn't any real OTP integration.
    If you run the server locally, then the OTP will be generated and logged to the server output.
    If you view the live demo then the OTP will be displayed as an alert and also logged to the browser console.

Logo

  • The wheat represents farmer's pride, and green around the wheat represents the Indian fields.

Logo of a bushel of wheat, in a green circle

Landing page flow

  • Unified landing page loads.
  • Do GET /user
    • If successful, go to respective dashboard.
  • Wait for user to enter valid phone, and press next.
  • Do POST /otp body: {phoneNumber}
    • If post is unsuccessful, then we have bigger problems.
  • (*) Wait for user to enter valid OTP, and press next.
  • Do POST /authenticate body: {phoneNumber, otp}
    • If post is successful, do GET /user
      • If user is found then go to respective dashboard.
      • Else user does not exist, goto signup.
  • Inform user that OTP is wrong, goto (*)

Project Structure

frontend
 ┣ contact
 ┃ ┣ index.html
 ┃ ┗ translation.js
 ┣ farmer
 ┃ ┣ index.html
 ┃ ┣ script.js
 ┃ ┗ style.css
 ┣ signup
 ┃ ┣ index.html
 ┃ ┣ script.js
 ┃ ┗ style.css
 ┣ videos
 ┃ ┣ farmer.mp4
 ┃ ┗ wholesaler.mp4
 ┣ wholesaler
 ┃ ┣ index.html
 ┃ ┣ script.js
 ┃ ┗ style.css
 ┣ background.svg
 ┣ index.html
 ┣ logo.svg
 ┣ mock-server.js
 ┣ script.js
 ┣ style.css
 ┣ translation.js
 ┗ util.js

Local Setup

  • Clone repository.
  • Setup MongoDB, either locally, in a Docker container or on the cloud.
  • Edit the MongoDB server Url in /server/server.js.
  • Run npm install and npm start in the /server folder.
  • Go to https://localhost:5000 in your web browser.

Website Demo

Swadeshi

Clean and simple UI.

0

Implemented Hindi and English, Font+ and Font- features for accesibilities.

1

Simple Sign Up: Mobile - OTP authentication (no need for e-mail or password)

SECURITY:

  • Mobile - OTP verification
    • OTP is valid for 5 minutes from issue time
    • Blind checking of OTP
  • Unified auth & identity token.
    • Token is stored as a cookie on the client side
    • Token valid for 2 days
    • Every privileged request is authenticated on the server side
    • Client side cookie is set to expire after 2 days

2

Farmer's Portal:

  • Minimized the number of buttons and pages for accesibility for the farmer.
  • Everything on one page.
  • Simple add and remove icon.

3

Simple add item page: Farmer can add quantity orginally with him and price per unit item.

4

5

Initially, the original added quantity is set to available quantity. As quantity is sold, the available quantity is updated, helping farmer keep track of what he added initially to the Farmer's Portal

6

Wholesaler's Portal:

7

Simple search bar to search product by category or item.

8

9

Simply selecting the item, and ordering directly the required quantity. It will be added to Ordered Items for Wholesalers, and Open Orders for Farmers.

10

Simply, pressing the tick icon, if the order is delivered, the wholesaler can update it for himself and the farmers.

11

Both the Farmer's and the Wholesaler's numbers will be provided on the portals and how the transactions will take place can be discussed over call, according to one's convenience.

Contact Page - Simple and User-friendly:

  • 24 X 7 Helpline Service Center
  • Videos in Hindi explaining working of site to help both, the farmers and the wholesalers.
  • Added FAQs, in Hindi and English

12 13 14

Authors

swadeshi's People

Contributors

dependabot[bot] avatar harshkapadia2 avatar imgbotapp avatar kartiksoneji avatar kushal98 avatar tusharnankani avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar

swadeshi's Issues

bug: implement check for the quantity

Implement check from the wholesaler's end, if the quantity he's ordering is more than the available quantity (at the farmer's end), then, disable the ADD button and notify the wholesaler about the same.

OTP is Not Coming

Hey,

I tried logging in using my phone number but did not recieve the OTP. Can u check please?

Thanks

Security Issue

I've provided wrong Contact number(for testing) and Obviously I didn't get the OTP but somehow I still manage to access the portal because the OTP was shown in the developer console.
This is a small mistake but can fail the whole security mechanism
Can I remove that from the code?

add google translate dropdown

Add google translate dropdown for multiple languages instead of just Hindi, the page will translate to any language under Translate.

Issue with zoom in and out

Hey,

As of now the user can zoom in and out to unlimited extent. I think if there is some restriction in the upper and lower limit that would be great.

Thanks

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.