๐Ÿง  AI ๊ณผ์‹ค ๋ถ„์„๊ธฐ blame-detector

๐Ÿ“Œ ํ”„๋กœ์ ํŠธ ๊ฐœ์š”

๋…ผ์Ÿ ์ค‘์ธ ์นด์นด์˜คํ†ก ๋Œ€ํ™”๋ฅผ ์—…๋กœ๋“œํ•˜๋ฉด

AI๊ฐ€ ๊ฐ์ •, ๊ณต๊ฒฉ์„ฑ, ๋ฉ”์‹œ์ง€ ํ๋ฆ„ ๋“ฑ์„ ๋ถ„์„ํ•ด

๊ณผ์‹ค ๋น„์œจ์„ ์‚ฐ์ •ํ•˜๊ณ  ์‹œ๊ฐํ™” + ๊ณต์œ  ๊ฐ€๋Šฅํ•œ ๋ฆฌํฌํŠธ๋ฅผ ์ƒ์„ฑํ•˜๋Š” ์›น ์„œ๋น„์Šค.

๐Ÿ“ ํ”„๋กœ์ ํŠธ ๊ตฌ์กฐ ๋ฐ ๊ธฐ์ˆ  ์Šคํƒ

blame-detector/
โ”œโ”€โ”€ backend/     # Spring Boot API ์„œ๋ฒ„
โ”œโ”€โ”€ frontend/    # React + Vite SPA ํด๋ผ์ด์–ธํŠธ
โ”œโ”€โ”€ .gitignore   # ๊ณตํ†ต ๋ฐ ๋ฏผ๊ฐ ์ •๋ณด ์ œ์™ธ
โ”œโ”€โ”€ README.md
์˜์—ญ ์‚ฌ์šฉ ๊ธฐ์ˆ 
ํ”„๋ก ํŠธ์—”๋“œ React, Vite, Tailwind CSS, Chart.js, html2canvas
๋ฐฑ์—”๋“œ Spring Boot, Tesseract4J, WebClient
AI ๋ถ„์„ Hugging Face API (๊ฐ์ •/๊ณต๊ฒฉ์„ฑ ๋ชจ๋ธ)
๊ณต์œ  ๊ธฐ๋Šฅ Kakao SDK, Web Share API, ํด๋ฆฝ๋ณด๋“œ ๋ณต์‚ฌ
๋ฐฐํฌ Vercel (ํ”„๋ก ํŠธ), Render or EC2 ์˜ˆ์ • (๋ฐฑ์—”๋“œ)

โœ… ์ฃผ์š” ๊ธฐ๋Šฅ๋ณ„ ํ๋ฆ„ ๋ฐ ํ•™์Šต ๋‚ด์šฉ

1. ์ด๋ฏธ์ง€ ์—…๋กœ๋“œ ๋ฐ ๋ฏธ๋ฆฌ๋ณด๊ธฐ

const [image, setImage] = useState(null);

const handleImageChange = (e) => {
  const file = e.target.files?.[0];
  if (file) {
    setImage(file);
    setPreview(URL.createObjectURL(file));
  }
}