Code Monkey home page Code Monkey logo

gssoc-website-new's Introduction

GSSoC Logo Light GSSoC Logo Dark

Official website repository for the GirlScript Summer of Code 2024 (GSSoC'24)

GirlScript Summer Of Code is a three-month-long Open-Source Program conducted every summer by the Girlscript Foundation.
With constant efforts, participants contribute to numerous projects under the extreme guidance of skilled mentors over these months. With such exposure, students begin to contribute to real-world projects from the comfort of their homes. GirlScript Summer Of Code has witnessed active participation over the years, and the 2024 edition aims to carry the legacy with a promising impact.


  • This is a Next.js project bootstrapped with create-next-app.
  • Subsequently this was designed from scratch purely using TailwindCSS framework and does not use any predefined UI library or design system.
  • The brand palette and prototype was designed in Figma and can be found HERE

Preview

gssoc-website.webm

Setting Up the Development Environment

First, install the node modules & dependencies:

npm i
# or
yarn

Getting Started

Next, run the development server:

npm run dev
# or
yarn dev

Open http://localhost:3000 with your browser to see the result.

Project Structure

.
├── .github
│   └── workflows
│       ├── gssoc-deploy.yml
│       └── contributors.yml
├── public/*
├── components/*
├── pages/*
├── styles/*
├── package.json
├── next.config.js
├── tailwind.config.js
├── postcss.config.js
├── README.md
├── LICENCE
└── contributors.md
  • You can start editing the homepage by modifying pages/index.js. The page auto-updates as you edit the file.
  • All the other pages under the pages directory are a part of the sitemap and represent the different webpages in the website.
  • API routes can be accessed on http://localhost:3000/api/hello. This endpoint can be edited in pages/api/hello.js.
  • The pages/api directory is mapped to /api/*. Files in this directory are treated as API routes instead of React pages.
  • The various components used in the pages have been defined under components directory
  • public directory contains all the assets used in the project (including images, certificates, graphics and logos) The styles/globals.css file consists of all the custom css used apart from inline Tailwind styles.

Theming and Dual Modes

The website was designed to support both light and dark themes. It reads the current theme preference of the client browser and accordingly applies the state throughout the website.

Light Mode

Toggle me to Preview!

image

Dark Mode

Toggle me to Preview!

image

You can check out the Next.js GitHub repository - your feedback and contributions are welcome!

Deploy on Vercel

The easiest way to deploy your Next.js app is to use the Vercel Platform from the creators of Next.js.

Check out our Next.js deployment documentation for more details.

Deploy on GitHub pages

The website in our case was deployed on GitHub pages using a custom workflow that can be found at .github\workflows\gssoc-deploy.yml

At the time of writing this project, GitHub did not provide GitHub pages configuration for Next.js by default and thus, had to be deployed using the next-pages workflow from the Github Actions marketplace

Participating Projects List

Project List

The list of participating projects for the GirlScript Summer of Code 2022 as well as in the previous editions is made available through the JSON Endpoint available HERE which is actually the raw version of the selected project list available in THIS Google Sheet.

Leaderboard

Leaderboard

The leaderboard's backend is hosted in Heroku and is developed in a separate repository which can be found HERE.
This uses the GitHub OctoKit SDK documented HERE to fetch merged PR data for each contributor in the program and calculates their global rank as per labels assigned by the project owners/maintainers as per the following scoring system:

Discord Scoring System

Note - The dynamic leaderboard was disconnected at the last date of the program at midnight (ie, 6/2/2022, 23:59:52 PM) and replaced using the static json of contributors' final ranking data. It can found at pages\api\leaderboard.json

Onchain Certificate Verification

Certificate Verifier

The website includes a feature of onchain certificate verification to provide convinient download of certificates for eligible participants in each role: namely Top 100 Contributors, Top Mentors, Top Project Admins, Top Campus Ambassadors and the organising team. The data of eligible open-sourecerers can be checked under pages\JSON directory

The smart contract and ABI used to achieve this can be found at pages\JSON\Certificates.sol and pages\JSON\ABI.json respectively.

Learn More on Next.js

To learn more about Next.js, take a look at the following resources:

gssoc-website-new's People

Contributors

suvraneel avatar code-reaper08 avatar gurjeetsinghvirdee avatar github-actions[bot] avatar swapnilsparsh avatar nawed2611 avatar mehakagg1313 avatar princegupta101 avatar anubhavdevv avatar gaganpreetkaurkalsi avatar saviour1001 avatar kartikmehta18 avatar kpriyanshu2003 avatar hemantkr071 avatar monizb avatar rebsfalcao15 avatar hustler0109 avatar aman-manwani avatar hemantsachdeva avatar shobhitexe avatar khaja13 avatar sanjay-kv avatar vyomrana02 avatar tanay-errorcode avatar abhinav2712 avatar bravo68web avatar nehal-5 avatar ardent10 avatar vinayak-vohra avatar isayakmondal 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.