Git Product home page Git Product logo

code-review-pals's Introduction

Shows an illustrated sun in light mode and a moon with stars in dark mode.


GitHub GitHub Workflow Status GitHub issues GitHub pull requests


Code Review Pals

Code Review Pals is a community-driven platform for code review, designed to help developers learn from each other and improve their skills by providing a place to share their code and get feedback from peers.

Our goal is to encourage developers of all levels to submit their code for review and to foster a supportive and collaborative environment where senior developers can help juniors learn and grow. We believe that code review is a vital part of the software development process, and that it helps improve code quality, catch bugs and security issues, and share knowledge.

Our Stack

  • Back
    • PHP >= 8.1 ( prefer 8.2 )
    • Laravel >= 10.0
    • node.js >= 17.4
    • MySQL >= 8.9
    • Redis > 7.0
    • Sail
  • Front
    • React >= 18.2
    • Tailwind >= 3.2
    • Inertia >= 1.0
    • Vite >= 4.0

How to setup development environment

WARNING - You need to have Composer (Composer -V to verify) and Docker installed to continue

First of all, you'll need to fork the project, then clone your repo

git clone [email protected]:{YOUR_ACCOUNT_NAME}/code-review-pals.git && cd code-review-pals

Duplicate the .env.exemple file as .envand change the following lines

.env.exemple .env
APP_URL=http://localhost APP_URL=http://127.0.0.1
DB_HOST=127.0.0.1 DB_HOST=mysql
If you need to work on authenticated pages

On your Github Account, go to Settings > Developer Settings > OAuth App

Then fill in the form as the following :

After registering, create your client secret and put http://127.0.0.1 as the Homepage URL

In .env file, at the very bottom, fill in the github section with the credentials given after register the app on GitHub.

GITHUB_CLIENT_ID= /*YOUR CLIENT ID*/
GITHUB_CLIENT_SECRET= /*YOUR CLIENT SECRET*/
GITHUB_REDIRECT=http://127.0.0.1/auth/callback/github

Install Sail on docker, install dependencies, initialize database, launch instances

docker run --rm \
    -u "$(id -u):$(id -g)" \
    -v "$(pwd):/var/www/html" \
    -w /var/www/html \
    laravelsail/php82-composer:latest \
    composer install --ignore-platform-reqs
./vendor/bin/sail npm i && ./vendor/bin/sail composer update

Generate the application key

./vendor/bin/sail php artisan key:generate 
./vendor/bin/sail artisan migrate:fresh --seed
./vendor/bin/sail up -d

And you are good to go :)

When you are done, don't forget to cut docker

./vendor/bin/sail down

Contribution

If you're interested in contributing to Code Review Pals, please check out the Issues and join our community. Together, we can make code review a more accessible and rewarding experience for everyone.

License

Code Review Pals is Licensed under The MIT License (MIT). Please see License File for more information.

code-review-pals's People

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  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  avatar

code-review-pals's Issues

Add webhook scope

On login, add webhook scope to user repo to allow webhook generation to easy get update

list of pull requests

main document #8

description

we need an index page to list pull requests.

technical

  • it should support query parameter filters ( use a library to manage filters )
  • take care of N+1

DOD

  • make simple list for it
  • write tests

review url validation

code reviews are available at GitHub/GitLab pull requests.

somehow, on submitting the review request, we should validate whether it is a pull request.

we have some options :

  • do not publish the request until a human approves it.
  • use URL validation ( it has a particular schema like REPO/pull/{id} )
  • use GitHub integration to get the information of a URL ( i don't know if is it possible ?) ( also is it available for GitLab and others? )

github profile integration

as you know, once someone creates a new review request, should mention the Github profile.

we need an integration of GitHub API to fetch more detail of User by GitHub username.

what we need to get:

  • is it a valid profile?
  • Avatar
  • name
  • bio

technical expectation

  • make a service for GitHub
  • after submitting the review request ( use observer on Project model ) store data on the cache
  • on show and index of Project show the sample data like ( avatar and others ) with correct data ( read from cache )

Crud for Repositories ( Busy man scenario )

as you can see on #8 we need a form for a busy man to submit their project.

then he can manage them on his dashboard:

  • manage repositories
  • manage pull requests ( we can do nothing for this because it's the same as making a manual review request #12 )

technical

  • have a model called Repo ( do not name it Repository because conflicts naming with the Repository pattern )
  • use soft delete for deletion
  • do this on user dashboard.
  • for now just store it and do nothing. :)
  • it will be awesome if we have some test for the crud. ( simple one )

Repo, pull request integration

main document #8

we should get a list of the repository pull request in certain intervals

I prefer instead of corn job, to use a timed queue, but it has its own risks.

for now

  • decide update strategy
  • integrate with GitHub to get the pull requests
  • make a service to create pull requests.
  • avoid creating duplicate pull requests.
  • write strong tests please
  • it will be good if find a good third party to handle GitX integrations instead of writing by hand.

so let's discuss here about the strategy.

pull request detail page

main document: #8

description

we need detail page for pull request,
it should contain good information about the user and pull request.

technical

  • for now just implement basic and wait for design in next step
  • read everything from database don't do any API call to third party

Add webhook to repo when adding a new one

We have to create a new webhook url on the repository with the access token of the auth user and we need to be sure no ones can guess this webhook (to avoid postman push to our webhook)

Something like UUID + Crypt at the end and maybe store it into the DB ?

Webhook Model (Poly Morph ?) with UUID ?

Landing Page

Codereviewpals.com is an open-source platform for code reviews. Our goal is to encourage collaboration among developers by making it easier for them to get feedback on their code. We have a blog and a section for review requests, where developers can submit their code for review by more experienced colleagues.

Goal of Landing Page

We want to create a landing page that will help us reach out to junior developers and encourage them to submit their code for review. At the same time, we want to encourage more experienced developers to review code and contribute to the community.
Sections of Landing Page

  • Header: with the name of the website and a short tagline that summarizes the purpose of the website.
  • Call to action: a prominent button or form that invites users to submit their code for review.
  • Testimonials: a section that includes quotes from developers who have used our platform to get feedback on their code, highlighting the benefits of using the platform.
  • About us: a section that provides some information about who we are, our mission, and what we do.
  • Contact us: a section that includes a form or contact information for users who want to get in touch with u

Definition of Done (DOD)

  • Figma design: A detailed Figma design that includes all the sections mentioned above and is aligned with the overall visual style of our website.
  • Convert to HTML and CSS with Tailwind: The landing page should be responsive and compatible with different devices and browsers. It should be built with HTML and CSS using the Tailwind framework.
  • Connect with Laravel: The landing page should be integrated with our Laravel application and hosted on our server.

P.s

it will be awesome if we find a UI/UX designer and frontend developer for this issue ❤️

Remove UiAvatar Service

Since we don't allow user to register and login without Github account, we don't need UiAvatar Service and code related !

Error handling

In every try catch block for repository, pull request about API call, maybe log somewhere all the thing with adding notification, flag or idk !

Dashboard crud for pull requests ( Junior Scenario + busy man )

as you see #8 we need CRUD in dashboard ( just index, create, delete, edit and redirect show to an #14 )

technical

  • make a model called PullRequest
  • fields : title, url, status, description
  • only title and url is fillable by user others will complete automaticly
  • we will add more fields in future.
  • use PHP enum for status and store string in database
  • it will be good if we have simple feature test ( we need it in future )

Update documentation

Discussed in #64

Originally posted by olarno April 16, 2023
Hello,
I think it would be good to update the documentation for new developers.

  • How to install locally. - At least
  • How to start your contribution, your first problem, your first report.
  • How to make a good review

Maybe add more details about the current stack: Laravel / react with their version.

Another question: do you have a template for PR?

Just a suggestion to be more readable.

setup CI/CD

we need to have a GitHub action.

the flow :

  • update source code ( git pull )
  • run php artisan migrate
  • run npm install && npm run build
  • run php artisan optimize

update Pull Request

  • insert just open and draft PRs
  • check for status update (and some other data {just make structure we don't decide about which data} ) in interval

extract information of request

main document #8

please see #15 and #9

this website could be a hub to connect open-source contributors and project owners.

for a better experience, we should display more information about a request.

likes :

  • pull request status
  • project languages
  • description of the pull request
  • project details, stars, ...

technical

  • each pull request should check status in period
  • we should add more fields on PullRequest model ( based on what data we can extract )
  • we should talk about update status strategy
  • make a service to get detail of a pull request also check #15
  • write strong test please

pull request language

for Category purposes, we need to have the language main of the Pull Requests.
then we can show it better on Discord.

changes

  • add language to the PR model
  • create discord code review forums based on the languages
  • On the website create a pull request make drop-down to specify the language
  • Implement a feature for an automatic detect language
  • category table ( if the possible fixe is good ) 🤷‍♂️

problems we may face:

  • HTML and CSS are 2 different languages but we need them in one ( there will be more like this i think )
  • we can not detect the framework, like it's Yii or Larael, React or Vue or Angular or ...
  • a Pr may change a lot of files including different languages
  • we may have PR to DockerFiles and we can not specify what this Pr is for

Possible fixes

  • have special categories and manually and automatically make some rules to detect what the PR category is ( so we need to have a category table to add categories to the website )

Handle github profiles that don't have real name filled out.

Right now we only assume that github user has a real name in their profile. Because not every github user has filled out their real name, we need to also have a column for nickname.

Right now also if the user does not have a real name, sql will throw an error when such user is attempting to register because the column 'name' is not allowed to be nullable

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.