DEV Community

Discussion on: Hacktoberfest 2021 — Who's Looking for Contributors?

Collapse
 
rizkyrajitha profile image
Rajitha Gunathilake

Hi everyone,

I am excited to announce that Linkin will be participating in 2021 Hacktoberfest 🎃.

LinkIn is a self-hosted link tree application that you can customize to create your own link tree page.

GitHub logo RizkyRajitha / linkin

Linkin is a customizable self hosted link tree platform.

Linkin logo

Linkin · DeepScan grade codecov license Github Actions

Linkin is a customizable self-hosted link tree application.

100% Free and Open Source 💯

Self Hosted, you own your data 💽

Customize your link tree with few clicks with a feature-rich dashboard 🤖

SEO friendly design built using Next js 🕸️

Supports 3 one-click deploy hosting providers 🚀


View Demo
Demo Admin http://linkindemo.vercel.app/admin

  • Demo username = admin
  • Demo password = linkin123

linkin gif


Deploy with Vercel

Deploy with Vercel

Deploy with Heroku

Deploy

Deploy with Railway

Deploy on Railway

Screenshot_2021-05-22 LinkIn's Link tree Page

Screenshot_2021-05-22 Linkin Dashboard

Screenshot_2021-05-22 Linkin Dashboard

Getting started

  • Deploy in Vercel
    • set environment variables
      • DATABASE_URL - Postgres database url
      • HASHSALT - random secret key
      • NODE_ENV - set NODE_ENV to production
    • after successfully deploying visit youdomain/admin to view admin login
    • use default login credentials
      • username = admin
      • password = linkin123
    • after a successfull login you will be able to see above admin dashboard.


  • Deploy in Heroku
    • set environment variables
      • DATABASE_URL - Postgres database url
      • HASHSALT - random secret key
    • after successfully deploying visit youdomain/admin to…

Linkin is built using

  1. Next.js
  2. Postgres as the database.
  3. Prisma as the ORM.
  4. Bootstrap 5 for UI components.

following issues are open for contribution, also feel free to try out new things add issues regarding linkin.

Editable avatar border colors #31

currently avatar border color is hard coded to #fff color .

This has to be dynamic, so that the users can customize the color .

The new form input for color should be under the Colors tab in the dashboard

rough workflow

  1. add new form Input with color type (use bootstrap), github.com/RizkyRajitha/linkin/blo...

and register it with the react-form-hook register method passed avatarBorderColor . destructure avatarBorderColor variable . (refer the existing implementation) github.com/RizkyRajitha/linkin/blo...

  1. add new column to the pagedata relation in prisma with name avatarBorderColor and type String? @db.VarChargithub.com/RizkyRajitha/linkin/blo... .

  2. migrate the modified prisma schema prisma doc . (when migration dev you will need permission to create databases , if such problem occurs use docker postgres instance ).

  3. destructure the new avatarBorderColor variable and the pass it to the styles
    github.com/RizkyRajitha/linkin/blo...

  4. test whether everything works.

avatarborder

Editable height and width in link cards #41

currently link tree max width is hard corded to 320px

github.com/RizkyRajitha/linkin/blo...

current scenario

it should be dynamically changed using the dashboard.

The new form input for width should be under the General tab in the dashboard

tentative workflow

  1. add new form Input with number type github.com/RizkyRajitha/linkin/blo...

and register it with the react-form-hook register method passed pageWidth . (refer the existing implementation)

  1. add new column to the pagedata relation in prisma with name pageWidth and type String? @db.VarChar

github.com/RizkyRajitha/linkin/blo... .

  1. migrate the modified prisma schema prisma doc . (when migration dev you will need permission to create databases , if such problem occurs use docker postgres instance ).

  2. destructure the new pageWidth variable and the pass it to the styles
    github.com/RizkyRajitha/linkin/blo...

  3. test whether everything works.

Cheers 🥂

Happy Hacktoberfest 🎃