* only some features are implemented : issues CRUD & notifications
Expect stuff to break.
- Login/Logout
- HomePage (README content)
- Responsive Layout
- Settings page for toggling theme
- See Profile informations
- Update username
- Issues List page
- Search & filter issues by author, label, assignee, closed/open, title, mentions, etc. (Inspiration: https://github.com/openstatusHQ/openstatus, https://docs.github.com/en/issues/tracking-your-work-with-issues/filtering-and-searching-issues-and-pull-requests)
- New issue page
- Issue CRUD (by the author only)
- Comments CRUD
- Mentions
- Issue Popovers (for previewing issues)
- Linking between issues
- Assign & self assign issues
- OpenGraph
- landing (inspiration: https://github.com/trpc/trpc/blob/main/www/og-image/pages/api/landing.tsx)
- Per Issue (inspiration: https://opengraph.githubassets.com/101e5bdeef8e959c800fab2aef88eef0b01b15d883e3e17c990bde8dfd67d6b3/trpc/trpc/issues/4306)
- Labels CRUD (can only add or update labels, no deleting)
- Notifications page
- Notifications badge (Inspiration: https://gist.github.com/Fredkiss3/ab918aee3977d681f0508537a44838c0, https://github.com/Fredkiss3/bunrest)
- Notifications for issues subscriptions
- Notifications for mentions
- Notifications for issue statuses
- Filter notifications by status, title, closed, etc.
- Mark as done, unsubscribe
-
cloudfare for the hosting
-
tailwindCSS for the styling
-
bun + honojs for replacing a local instance of cloudfare KV, used for sessions and caching of data
- Node >= v16.6.2
- PNPM >= v6.22.2
- A neon database
- A registered github app for authenticating users
-
First you have to clone the repository
git clone https://github.com/Fredkiss3/gh-next.git
-
Install the dependencies on the bun server and launch it :
cd server bun install bun run dev
the server will be open at http://127.0.0.1:3001
-
Move to the
www
folder : -
Then, Install the dependencies :
pnpm install
-
Rename
.env.example
to.env.local
And change the file to your needs, -
And launch the project :
pnpm run dev
The app will show at http://localhost:3000.
-
Open the source code and start rocking ! 😎
A quick look at the top-level files and directories you will see in this project.
.
├── server/
└── www/
├── src/
│ ├── app/
│ │ ├── (actions)
│ │ ├── (components)
│ │ ├── (models)
│ │ └── (routes)
│ └──lib/
│ ├── db/schema
│ └── hooks
├── .prettierrc
├── pnpm-lock.yaml
└── tsconfig.json
-
server/
: this folder contains the source code to a local server implemented in bun used for replacing the Key/Value Store on cloudfare, since we use edge runtime for our projet we couldn't have just done it in our next app as it store keys in files and we don't have access to FILE I/O on edge runtime. -
www/src/app/
: this folder contains the source code to our app :-
(actions)
: this folder contains all the logic of our app. -
(components)
: this folder contains all the components of our app. -
(models)
: this folder contains all the DB models of our app. -
(routes)
: this folder contains all the routes & pages of our app.
-
-
www/src/lib/
: this folder contains utils & helpers used throughout our app :-
db/schema
: this folder contains all the drizzle sqlite schema for our DB. -
hooks
: this folder contains all the react custom hooks used in the app.
-
-
www/.prettierrc
: this file contains the configuration for prettier to enable autoformatting. -
www/pnpm-lock.yaml
: this file contains the dependencies lock for the repo. -
www/tsconfig.json
: this file contains the configuration for typescript, that are used by the all the underlying packages
Nom | role |
---|---|
SESSION_SECRET |
random 32 chars length string used to encode the session id |
NEON_DB_URL |
url of the neon database, as shown in neon dashboard |
KV_REST_URL |
LOCAL file server URL for storing key values |
GITHUB_CLIENT_ID |
github client id stored for our app used for authenticating users with github |
GITHUB_PERSONAL_ACCESS_TOKEN |
github client token stored for our app used for authenticating users with github |
GITHUB_REDIRECT_URI |
URL to redirect when a user has been authenticated |
GITHUB_SECRET |
github secret stored for our app |