I developed Accred as a side project due to the struggles I faced in managing e-certificate generation for the Google Developer Student Clubs at the University of San Carlos. Our existing process of generating and storing certificates in our drive was time-consuming and required constant work from the core team. Additionally, it was taking up a significant amount of storage space.
To overcome these challenges, I created Accred to automate the certificate generation process and eliminate the need for storing them in the cloud. My app generated certificates on-demand, ensuring that no unnecessary data was stored and saving valuable storage space.
Additionally, developing Accred served as an opportunity for me to gain hands-on experience and enhance my knowledge of Next.js and its app router. Throughout the development process, I delved into the intricacies of Next.js, leveraging its powerful features to create a seamless and efficient user experience.
By working on Accred, I not only addressed the pressing issue of e-certificate management but also utilized it as a practical learning experience. Exploring the capabilities of Next.js and its app router allowed me to expand my skill set and deepen my understanding of web development frameworks. This project served as a valuable stepping stone in my journey to becoming a proficient developer, providing me with practical insights and expertise that I can apply to future projects.
Client:
Server:
Clone the project
git clone https://github.com/blurridge/Accred
Go to the project's directory
cd Accred/
Install dependencies
npm install
Start the server
npm run dev
π¦
ββ .eslintrc.json
ββ .gitignore
ββ README.md
ββ app
β ββ admin
β β ββ docs
β β β ββ layout.tsx
β β β ββ page.tsx
β β ββ home
β β β ββ layout.tsx
β β β ββ page.tsx
β β ββ login
β β β ββ page.tsx
β β ββ page.tsx
β ββ event
β β ββ [id]
β β ββ certificate
β β β ββ [certId]
β β β ββ page.tsx
β β ββ layout.tsx
β β ββ page.tsx
β ββ favicon.ico
β ββ globals.css
β ββ layout.tsx
β ββ page.tsx
ββ assets
β ββ accred_logo.svg
β ββ accred_ls.svg
β ββ accred_sq.svg
β ββ gdsc_logo.png
ββ components
β ββ AddEvent.tsx
β ββ AdminLoginButton.tsx
β ββ Certificate.tsx
β ββ CertificateVerifier.tsx
β ββ DataTable.tsx
β ββ EventCard.tsx
β ββ EventCardContent.tsx
β ββ EventDropdown.tsx
β ββ EventForm.tsx
β ββ Footer.tsx
β ββ GuestLoginButton.tsx
β ββ LoginCard.tsx
β ββ Navbar.tsx
β ββ RingLoader.tsx
β ββ ui
β ββ avatar.tsx
β ββ button.tsx
β ββ calendar.tsx
β ββ card.tsx
β ββ columns.tsx
β ββ dialog.tsx
β ββ dropdown-menu.tsx
β ββ form.tsx
β ββ input.tsx
β ββ label.tsx
β ββ navigation-menu.tsx
β ββ popover.tsx
β ββ table.tsx
ββ context
β ββ AuthContext.tsx
β ββ EventDataContext.tsx
β ββ ThemeContext.tsx
ββ firebase
β ββ config.ts
ββ lib
β ββ utils.ts
ββ next.config.js
ββ package-lock.json
ββ package.json
ββ postcss.config.js
ββ public
β ββ next.svg
β ββ vercel.svg
ββ tailwind.config.js
ββ tsconfig.json
ββ utils
ββ compressBanner.ts
ββ deleteFromFirebase.ts
ββ fetchImageSize.ts
ββ generateLinkedInShareURL.ts
ββ parseCSV.ts
ββ uploadToFirestore.ts
ββ uploadToStorage.ts
I would like to acknowledge the work of Ned Palacios and GDSC University of Immaculate Conception as the inspiration for this project's concept of certificate generation which was originally done in Vue for LAWIG - a GDSC Philippines Info Session.