새해, 새로운 포트폴리오 챌린지 – Google AI 제공

발행: (2026년 1월 16일 오전 10:23 GMT+9)
3 min read
원문: Dev.to

Source: Dev.to

This is a submission for the New Year, New You Portfolio Challenge Presented by Google AI

Project Demo

About Me

저는 프론트엔드 개발자이자 AI 애호가로, 생성 AI와 사용자 경험이 만나는 지점을 탐구하고 있습니다. 이번 포트폴리오에서는 Google의 AI 도구가 어떻게 창작자들이 깊은 ML 전문 지식 없이도 지능형이고 반응형 웹 앱을 구축하도록 도울 수 있는지를 보여주고 싶었습니다.

How I Built It

Frontend: React로 구축하고 Tailwind CSS로 스타일링하여, 화면 판독기와도 잘 작동하는 깔끔하고 반응형이며 접근성 높은 UI에 중점을 두었습니다.

Backend: Google Cloud Run에 배포했으며, FastAPI(Python) 또는 Node.js 중 하나를 사용해 요청을 처리하고 프론트엔드와 AI 서비스 사이의 다리 역할을 합니다.

AI Integration: Google AI Studio를 통해 Gemini API를 활용해 동적 텍스트 생성, 문서 이해, 대화형 기능 등을 구현했습니다—Drive‑linked URL이 시사하듯 Google Drive 파일에서 직접 콘텐츠를 가져올 수도 있습니다.

Workflow: 사용자는 직관적인 인터페이스를 통해 앱과 상호작용합니다; 입력값(또는 선택된 Drive 문서)은 안전하게 백엔드로 전송되고, 백엔드는 이를 포맷하여 Gemini API에 전달한 뒤 AI가 생성한 응답을 받아 화면에 렌더링합니다.

What I’m Most Proud Of

  • Seamless Integration: 사용자용 웹 앱을 Google Drive와 Gemini에 성공적으로 연결하여 개인 문서와의 지능형 상호작용을 가능하게 했습니다.
  • Accessibility‑First Design: UI가 보조 기술을 사용하는 사용자에게도 완전히 탐색 가능하고 사용 가능하도록 보장함으로써, 강력한 AI 도구도 포용적일 수 있음을 증명했습니다.
  • End‑to‑End Ownership: 컨셉부터 배포까지 프로젝트를 직접 진행하며 사용자 경험, 성능, 책임 있는 AI 사용을 균형 있게 관리했습니다.
Back to Blog

관련 글

더 보기 »

기술은 구원자가 아니라 촉진자다

왜 사고의 명확성이 사용하는 도구보다 더 중요한가? Technology는 종종 마법 스위치처럼 취급된다—켜기만 하면 모든 것이 개선된다. 새로운 software, ...

에이전틱 코딩에 입문하기

Copilot Agent와의 경험 나는 주로 GitHub Copilot을 사용해 인라인 편집과 PR 리뷰를 수행했으며, 대부분의 사고는 내 머리로 했습니다. 최근 나는 t...