sahanmndl / upcoding-web

Get event details of competitive programming contests, hackathons etc.

UpCoding

Mobile App: (https://github.com/sahanmndl/UpCoding)

This project was bootstrapped with Create React App.

Available Scripts

In the project directory, you must install a package:

npm install

To start the website in your localhost :

npm start

Runs the app in the development mode.
Open http://localhost:3000 to view it in your browser.

The page will reload when you make changes.
You may also see any lint errors in the console.

npm run build

Builds the app for production to the build folder.
It correctly bundles React in production mode and optimizes the build for the best performance.

The build is minified and the filenames include the hashes.
Your app is ready to be deployed!

See the section about deployment for more information.

upcoding-web's Issues

Make the website complete mobile responsive

Make the website responsive and functional on mobile browsers, with best practices possible.

Bug Fix and Error Page

• Show Error 404 page if url not available
• Fix the dark mode bug

Dropdown menu for Practice button

Currently on clicking "Practice" button in the header, it opens the GFG Practice link. But it should be changed.
On clicking Practice, it should open a dropdown menu, with three options, clicking which will open the respective links.

• LeetCode: https://leetcode.com/problemset/all/
• Codeforces: https://codeforces.com/problemset
• GeeksForGeeks: https://practice.geeksforgeeks.org/explore?page=1&sortBy=submissions

Set correct url to contest names

Assign url to every contest name which will link to that page

Any new ideas?

Want to know what more features can be implemented. I will create new issues for those (for Hacktoberfest) or do by myself.

Make table header sticky

Make the table header (not the page header) stick to the top, once we scroll down the page

User Stats | CodeChef

When user enters any username under CodeChef in the "User Stats" page, it should display a block below that display all relevant details and statistics about that user, using charts or graphs wherever relevant (please refer to the user stats for Codeforces). Use CodeChef official API (if available) or any other 3rd party API if possible.

User Stats | LeetCode

When user enters any username under LeetCode in the "User Stats" page, it should display a block below that display all relevant details and statistics about that user, using charts or graphs wherever relevant (please refer to the user stats for Codeforces). Use LeetCode official API (if available) or any other 3rd party API if possible.

Seperate data into Upcoming and Ongoing

Show upcoming and ongoing contests in two different pages

UI Improvements

• Sticky header of table
• Change color of Upcoming / Ongoing in the header, to signify which one is active
• Make the timings to display in one line i.e. time and am/pm should not break
• Any other minor UI modifications

Add contest to calendar

• Create a button next to every contest title, clicking which it will take us to the event creating page of our calendar
• If possible, add a dropdown menu for popular calendars like Google, Yahoo etc.

Add contest event to multiple calendars

Currently on clicking the calendar button beside a contest name, it redirects to the google calendar add event page. But now it should have the option to add the event to 3 calendars (Google, Apple and Outlook).

• On clicking calendar button, open a small dropdown menu with the 3 options along with their logos
• Clicking on any option, should redirect to the add event page of that particular calendar, with title as the contest name, and start and end time same as that of the contest. Make sure that the start and end time are correct on all 3 calendars.
• The library currently being used should be able to add the event to Outlook as well as Apple calendar. If not, any other library can be used to replace this.

Dark mode

Set dark mode toggle on header

Add Footer

We can have a footer at the end saying "copyright reserved" or something else you find more suitable. We can also add contacts so that developers/users can reach out to us and give feedback.
I would like to implement this feature. Please assign it to me.
Thanks.

missing instruction in contribution.md file

To make run this website in localhost one has to install this package

    npm install 

it's missing if you assign this task i can do it

"Practice" dropdown menu arrow

• Show a dropdown menu arrow beside the "Practice" button matching the color scheme (light/dark mode)
• Change the background ripple of "Practice" from oval to rectangular to match that of "Upcoming" or "Ongoing"

Invalid Date

Preview

search functionality

Change scrollbar according to dark mode toggle

Change scrollbar color to dark when night mode is on and vice versa

Website title and favicon update

Hey 👋, I would like to update the react app title and add new favicon related to programming.

Tittle: UpCoding

Please assign me this issue, appreciate that
Thank you!

User stats page | Codeforces

When user enters any username under Codeforces in the "User Stats" page, it should display a block below that display all relevant details and statistics about that user, using charts or graphs wherever relevant. Use codeforces API for this.

Frontend Enhancement

Current table is showing the information but not in a uniform pattern which could be improved and will make the website look more professional.

photo we can see in the end column pm is not in the line which doesn't look good.

I would like to implement the enhancement. Please assign it to me.

Make website mobile responsive

Make website to function properly on mobiles/tablets etc.

Sorting with respect to Coding platform

Selecting a perfect platform is very important when It comes to competitive programming.

Fix the duration bug

• Show correct time difference in the duration column
• If duration is less than a day, show in format HH:MM:SS
• If duration is less than 30 days, show in format DD:HH:MM:SS
• Else, just show in terms of Months or Years

Create User-Stats Page

• Create a new page User Stats
• Add its routing to header
• For now, just show the text "User Stats" inside the page