mightyjoew / opensourcedevs Goto Github PK

Open Source Devs - An open-source contribution project for newcomers.

License: MIT License

HTML 6.62% CSS 1.19% JavaScript 92.20%

react hacktoberfest-accepted good-for-beginners hacktoberfest2021 hacktoberfest good-first-issue javascript reactjs open-source

opensourcedevs's Introduction

Open Source Devs

Open Source Devs is an open-source contribution project for newcomers.

If you'd like to save this repository, find related projects, or show your appreciation for this project, click the ⭐️ Star button.

How to Run Locally

Fork this project with the Fork button at the top of the project.
In your terminal, run the following commands:
- git clone https://github.com/MightyJoeW/OpenSourceDevs.git
- cd OpenSourceDevs
- yarn
  - Linux users, note that yarn comes from the Yarn Package Manager, not cmdtest. Please see the Yarn documentation for how to install yarn via npm
- yarn start
The project will run in your browser at http://localhost:3000/.

How to Contribute

For a more detailed contribution guide (with images), follow along with my Contributing to Open Source Starter Guide.

Create a new branch in the terminal with git checkout -b 'name-of-branch' i.e. git checkout mightyjoe-card
In src/components/dev-grid-utils.js, add a new object with your info at the bottom of the file (refer to the existing dev objects as an example).
Stage your changes with git add .
Commit your changes with git commit -m "feat: description of change" i.e. git commit -m "feat: added info for mighty joe"
Push your changes with git push origin name-of-branch
In GitHub, create a pull request by clicking on the Pull requests tab and clicking the green New pull request button (be sure to change the compare branch to your branch name to point to base: main).
Give your pull request a name, add a description, a screenshot (optional), and click the gear icon next to Labels to add the hacktoberfest label if you want this to count towards the hacktoberfest challenge. Click Create pull request.
- Note for users new to GitHub: Project access with Triage permission is required to add the label yourself. You will generally not have permissions to add the label yourself on your first Pull Request.
If your branch has conflicts, you can use the web editor or command line options under This branch has conflicts that must be resolved to resolve the conflicts.

Usage

The website is running live at https://opensourcedevs.com/.
Each branch gets a Netlify deploy preview. After creating a pull request, you can find the url for your branch in the netlify section. Click on the Browse the preview: link.

Front-End Technologies

HTML
CSS
JavaScript
React
MUI (Material-UI)

Testing Libraries

Jest
React Testing Library

Credits

This project was created by and is maintained by Joe Warren. Special thank you to all of our awesome contributors!

License

View this project's MIT license here.

Sending Feedback

Found an issue or have a request? Submit an issue.

opensourcedevs's People

Contributors

Stargazers

Watchers

Forkers

mrswarren anandawira nlewis84 wijayaac yash-271120 ansh231001 rohitkothapalli riyakushwaha firstchaircoder rriegel r-i-c-h pavittarx rizaafandi kapil-kawathekar sairamnomula srideviabhirami chenna1199 iniobongudom7 rashisingh20 fullburnen wsameer devcer akk312000 adam-weiler siddhant-tripathy1 erikweibust akshat31 kevinjordan1994 ankushbhardwaj408 11kaze pulse99r kyloren04 gauravlokhande16 bhoomiika furrukhjamal simardeepsingh-zsh chirag14252 0x1bitcrack3r hayzedd2 aristo-13

opensourcedevs's Issues

Style the error page

Currently, error.jsx only has a div that says Error. Add styling and a message indicating that the user tried to hit a page that doesn't exist. Also, include a link to route back to home.

Prevent card photo from being clickable on individual user page

Clicking on photo on user page routes to error page

Swap footer hr with MUI Divider

The MUI Divider is lighter and comes with some handy props that'll make customizing it easier if desired in the future.

You'll essentially do the following:

import Divider from '@mui/material/Divider';

If you want to see its full list of props, check here https://mui.com/api/divider/.

Error with <p> elements inside components/about.js

Reason to fix this: https://stackoverflow.com/questions/41928567/div-cannot-appear-as-a-descendant-of-p

`reach/router` dependency conflict

@MightyJoeW
I got a dependency conflict, when first tried to install this project. I am using npm v7 along. When I tried npm i, it gave me a dependency conflict with reach/router. I digged in a little bit, and found that reach/router is not being maintained as of now.
storybookjs/storybook#14619

Also, since this project is pretty new, switching to react-router would make a lot more sense.
Thanks!

Add a scroll to top feature on the home page

Create toggle for dark mode

Add icons for social buttons

This is an enhancement. I want to replace the text with their social icons, it will give a good look.
Please assign this issue to me.

Resolve warning <button> cannot appear as a descendant of <button>.

(JS-0454) Found invalid characters in markup

Description

The issue is raised because of missing or unescaped JSX escape characters. These characters would be injected as a text node in JSX statements, which might not be intentional. These won't throw any syntax or runtime errors, but the rendered output will not be the same as expected.

Occurrences

There are 2 occurrences of this issue in the repository.

See all occurrences on DeepSource → deepsource.io/gh/MightyJoeW/OpenSourceDevs/issue/JS-0454/occurrences/

Add unit tests for components

Add unit tests for components (preferably with Jest and React Testing Library)

(JS-0463) Consider adding `propTypes` to the React component definition

Description

It is recommended to always add propTypes for a component as it avoids runtime errors. Using propTypes ensures valid properties being passed as props or being used as props.