Skip to content

Latest commit

 

History

History
156 lines (131 loc) · 6.82 KB

File metadata and controls

156 lines (131 loc) · 6.82 KB

Web Design

TODO

  • fixed the React CVE + make the repo visible
  • Refactor the CSS in the publication section of the main page (create apply css)
  • Reafctor unused div in the publications section of the main page
  • Reafctor unused div in the softwares section of the main page
  • Refactor the github button
  • Standardize the badge icon
  • Refactor the containers in the main page
    • Softwares
    • Publications
    • News
    • Team
  • add button in the softwares and publication section of the main page
  • update the font style in the software and publication item
  • add javacript and hover in the scroll of the hero section
  • Resize the twitter timeline to match the card size
  • Update the login form with zod
  • Replace import { useRouter } from 'next/router' with import { useRouter } from 'next/navigation';
  • Create a page to update/create publication
  • Move the navbar and navbarButton file into the component folder
  • Check the twitter/X embedding component (cookies issues) => twitter is not clear about this issue
  • Update the navbar
  • Create a corlor palettte and update the logo color accordingly
  • Clean up the tailwind config file
  • Choose font system => use (Poppins or Geist) for title
  • install Prettier Sorting Tailwind CSS Classes Automatically with Prettier
  • User server componenent instead of api, I not sure it is teh right way to do it ?
  • use react tweet component https://www.youtube.com/watch?v=Af4CR16VP2I
  • use github image as profile picture example Profile image URL from vgauthier
  • use clerk for authentification
  • use api key to protect the API
  • validate the member form
  • use react-icons library
  • add a stiky navbar on all pages
  • add color to error fields in the publication form
  • query google scholar api with doi if exist

References Javascript

References CSS

good font (to try)

html/css compoment

References Icons

Authentification

Good Tutorial

Design principle

Clean code in react

Design

  • margin before Title => mt-stitle
  • margin before/after SubTitle => mt-sstitle
  • Secion Title => text-h1 font-bold
  • Secion SubTitle => text-h3 font-semibold

SVG

$ npx @svgr/cli src/components/svg --out-dir src/components/icons --icon --typescript

Font

Color Palette

Web design examle

Background

Illustration

Database

API

Tutorial

Test the ai api route

$ curl -X POST \
  --header "Content-Type: application/json" \
  --header "Origin: https://dev.luxbulb.org/" \
  --data '{"message":"xyz"}' \
  http://localhost:3000/api/ai

RAG Tutorial