commit 63e6c640774d028fb109b9ffc1b6fcd6ae860d10 Author: Puechberty Arthur Date: Mon Mar 30 19:25:43 2026 +0200 Add SVG assets and TypeScript configuration - Created a new SVG for the Open Graph image (og-image.svg) with a gradient background and text elements. - Added Vercel logo SVG (vercel.svg) for deployment branding. - Introduced a window icon SVG (window.svg) for UI representation. - Initialized TypeScript configuration file (tsconfig.json) with strict settings and module resolution for a React project. diff --git a/.dockerignore b/.dockerignore new file mode 100644 index 0000000..b9a7b74 --- /dev/null +++ b/.dockerignore @@ -0,0 +1,5 @@ +node_modules +.next +.git +*.md +.env*.local diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..1f3f329 --- /dev/null +++ b/.gitignore @@ -0,0 +1,42 @@ +# See https://help.github.com/articles/ignoring-files/ for more about ignoring files. + +# dependencies +/node_modules +/.pnp +.pnp.* +.yarn/* +!.yarn/patches +!.yarn/plugins +!.yarn/releases +!.yarn/versions + +# testing +/coverage + +# next.js +/.next/ +/out/ + +# production +/build + +# misc +.DS_Store +*.pem +.vscode/ + +# debug +npm-debug.log* +yarn-debug.log* +yarn-error.log* +.pnpm-debug.log* + +# env files (can opt-in for committing if needed) +.env* + +# vercel +.vercel + +# typescript +*.tsbuildinfo +next-env.d.ts diff --git a/README.md b/README.md new file mode 100644 index 0000000..961b6e0 --- /dev/null +++ b/README.md @@ -0,0 +1,71 @@ +# BlocNote + +Bloc-notes Markdown en ligne, rapide et sans inscription. + +## Site public + +- Production: https://blocnote.arthurp.fr + +## Stack technique + +- Next.js 16 (App Router) +- React 19 +- TypeScript +- ESLint + +## Fonctionnalites + +- Edition Markdown avec apercu en temps reel +- Sauvegarde automatique des notes +- Recherche et tri des notes +- Notes epinglees +- Export d'une note +- Mode clair / sombre +- Raccourcis clavier + +## Lancement local + +Pre-requis: + +- Node.js 22+ +- npm + +Installation et demarrage: + +```bash +npm ci +npm run dev +``` + +Application disponible sur http://localhost:3000 + +## Scripts + +```bash +npm run dev # mode developpement +npm run lint # verification lint +npm run build # build production +npm run start # lancer le build production +``` + +## Variables d'environnement + +Le projet peut utiliser: + +- NEXT_PUBLIC_SITE_URL (exemple: https://blocnote.arthurp.fr) + +## Docker + +Un environnement Docker est disponible via [docker-compose.yml](docker-compose.yml). + +```bash +docker compose up -d +``` + +## Publication GitHub + +Points verifies avant publication: + +- Secrets et fichiers sensibles non exposes +- Fichiers d'environnement ignores par [.gitignore](.gitignore) +- Build et lint valides diff --git a/app/components/Editor.tsx b/app/components/Editor.tsx new file mode 100644 index 0000000..4a95f5d --- /dev/null +++ b/app/components/Editor.tsx @@ -0,0 +1,95 @@ +"use client"; + +import { useRef, useState } from "react"; +import { Note } from "../types"; +import Toolbar from "./Toolbar"; +import MarkdownPreview from "./MarkdownPreview"; +import { Pencil, Eye, Columns2 } from "lucide-react"; + +type ViewMode = "edit" | "preview" | "split"; + +interface EditorProps { + note: Note; + onUpdateNote: (id: string, updates: Partial) => void; +} + +export default function Editor({ note, onUpdateNote }: EditorProps) { + const textareaRef = useRef(null); + const [viewMode, setViewMode] = useState("split"); + const [title, setTitle] = useState(note.title); + const [content, setContent] = useState(note.content); + + const handleTitleChange = (newTitle: string) => { + setTitle(newTitle); + onUpdateNote(note.id, { title: newTitle }); + }; + + const handleContentChange = (newContent: string) => { + setContent(newContent); + onUpdateNote(note.id, { content: newContent }); + }; + + return ( +
+
+ handleTitleChange(e.target.value)} + placeholder="Titre de la note..." + /> +
+ + + +
+
+ + {(viewMode === "edit" || viewMode === "split") && ( + + )} + +
+ {(viewMode === "edit" || viewMode === "split") && ( +
+ +