Git Product home page Git Product logo

teamimpulse's Introduction

Team Impulse by Arhaan Bahadur

Team Impulse

This was the main team website created for Team Impulse - The Physics Club of The Mother's International School. It's main functionality was to register teams (with proper validation) and add them to a Google Sheets file.

This website was created using NodeJS, Express, and Pug - A template engine for NodeJS (https://pugjs.org/).

πŸš€ Quick start

  1. Install the Git CLI and clone this repository.

    https://git-scm.com/downloads

    # clone this repository
    git clone https://github.com/arhaanb/teamimpulse.git
  2. Install the node dependencies.

    Navigate into the directory you just cloned. You need to have NodeJS installed before you proceed with this step. https://nodejs.org/en/download/

    cd teamimpulse
    npm i 
  3. Open the source code and start editing!

    Use your favourite code editor and start coding! Create a .env file in the root directory and fill it with the following details:

    • EMAIL
    • PASSWORD
    • SHEET_ID

    This project is configured to work only with Gmail accounts.

  4. Follow these steps to enable all functionality from the website

    • Generate API keys for Google Sheets from (https://console.developers.google.com/apis/). Create a new project and enable the Google Spreadsheet API. Download your credentials (API Keys) and store them in a client_secret.json file in the root directory. Also remember to share the spreadsheet you are using with the 'Service Account' that google provides, and give it edit access. Thats the email that'll be adding all submissions to your spreadsheet.

    • Enable "Allow less secure apps access to your gmail account" from https://myaccount.google.com/lesssecureapps

  5. Compile and run your code

    run the following command in your terminal.

    node app.js

    You will find your website live on https://localhost:5000. To edit the frontend, edit files availaible in the views directory. To edit the contents of the confirmation email, edit the email.hbs file.

    Note: You will have to run this command every time you make changes to the source code. To avoid this, you can install a package called nodemon - https://www.npmjs.com/package/nodemon. This will update the browser every time you save your files automatically.

🧐 What's inside?

A quick look at the top-level files and directories you'll see in this project.

.
β”œβ”€β”€ node_modules
β”œβ”€β”€ public
β”œβ”€β”€ routes
β”œβ”€β”€ views
β”œβ”€β”€ .gitignore
β”œβ”€β”€ app.js
β”œβ”€β”€ Procfile
β”œβ”€β”€ package-lock.json
β”œβ”€β”€ package.json
└── README.md
  1. /node_modules: This directory contains all of the modules of code that your project depends on (npm packages) are automatically installed.

  2. /views: This directory will contain all of the code related to what you will see on the front-end of your site (what you see in the browser) such as your site header or a page template. This is all coded in Pug.

  3. .gitignore: This file tells git which files it should not track / not maintain a version history for.

  4. routes: This folder contains routes that the user would visit and which files it will render for them.

  5. public: This folder contains all files which are available publicly on the server, such as the CSS files, images, fonts, etc.

  6. package-lock.json (See package.json below, first). This is an automatically generated file based on the exact versions of your npm dependencies that were installed for your project. (You won’t change this file directly).

  7. package.json: A manifest file for Node.js projects, which includes things like metadata (the project’s name, author, etc). This manifest is how npm knows which packages to install for your project.

  8. README.md: A text file containing useful reference information about your project.

πŸ’« Functionality and Pages

Every submission is stored in a Google Sheet with a randomly generated password for each team. Each team also receives a confirmation email with their team information instantly.

  1. / - Overview of Team Impulse
  2. /members - A list of members in Team Impulse with their positions
  3. /register - A registration page for Enigma - Team Impulse's annual online cryptic hunt. This route will show you that registrations have ended. you can access the register page at /arhaanb.
  4. /arhaanb - Registration functionality here. (Ideally should have been present at /register but it was disabled since registrations ended.)
  5. /enigma - Redirects to the URL where Enigma was held (https://enigma.teamimpulse.co.in).

teamimpulse's People

Contributors

arhaanb avatar

Stargazers

 avatar  avatar

Watchers

 avatar  avatar

Forkers

akshat-creator

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.