구글 시트 링크만으로 실시간 제품 리스트 공유 및 반영
Jump to 0:00기존 엑셀 파일 공유 방식은 내용이 변경될 때마다 파일을 다시 보내야 하는 불편함이 있었다. 구글 시트는 이러한 한계를 극복하며, 상단의 링크만 전달하면 내용이 실시간으로 공유된다. 홈페이지에 연동하는 방법 또한 매우 단순하며, 특정 버튼이나 텍스트에 이 구글 시트 링크를 연결만 해주면 된다.
구글 시트의 실시간 업데이트 기능을 활용하여 홈페이지 관리의 효율성을 극대화하고, 클로드 AI를 통해 코드를 생성하는 과정을 시연한다.
Want the next one from this channel too?
기존 엑셀 파일 공유 방식은 내용이 변경될 때마다 파일을 다시 보내야 하는 불편함이 있었다. 구글 시트는 이러한 한계를 극복하며, 상단의 링크만 전달하면 내용이 실시간으로 공유된다. 홈페이지에 연동하는 방법 또한 매우 단순하며, 특정 버튼이나 텍스트에 이 구글 시트 링크를 연결만 해주면 된다.
구글 시트 연동의 가장 핵심적인 기능은 관리자가 홈페이지 관리자 페이지에 접속하지 않고도 구글 시트에서 내용을 수정하면 실시간으로 홈페이지에 반영된다는 점이다. 이는 제품의 속포장 수량을 수정하는 시연을 통해 직접 확인할 수 있었는데, 시트 내용을 변경하자마자 홈페이지에도 변경된 내용이 즉시 나타났다.
구글 시트는 공유 기능을 통해 액세스 권한을 설정할 수 있다. 소유자와 편집자는 내용을 편집할 수 있는 권한을 가지며, 이들은 주로 관리하는 담당자가 된다. 반면, 일반 액세스 권한의 '뷰어'는 링크만 있다면 인터넷상의 모든 사용자가 내용을 볼 수 있게 하여, 비로그인 사용자도 효율적으로 정보를 열람할 수 있도록 한다.
구글 시트 연동을 통해 구현된 제품 리스트는 웹페이지 형태로 깔끔하게 제공되며, 사용자 편의 기능을 강화했다. 규격 검색 창을 통해 특정 사이즈를 입력하면 관련 제품을 즉시 찾아볼 수 있으며, 견적 문의 기능도 포함되어 있다. 또한, 내용을 인쇄하고 싶을 때는 규격표 인쇄 버튼을 눌러 인쇄 화면에서 바로 출력할 수 있다.
새로운 제품 리스트를 만들려면 구글 드라이브에 접속하여 플러스 버튼을 누르면 된다. 이 버튼을 통해 실시간으로 반영되고 특정인 또는 모두에게 공유할 수 있는 문서를 선택할 수 있다. 문서 생성 후 공유 버튼을 클릭하여 특정 사용자를 초대하거나, 링크 접근성을 제어하여 원하는 사람에게만 정보를 공유할 수 있다.
공유 링크가 있는 모든 사용자가 해당 화면을 단순히 볼 수만 있는 것이 기본 뷰어 권한이다. 하지만 이 뷰어 권한을 편집자 권한으로 변경하면, 링크가 있는 모든 사용자가 파일의 내용을 편집할 수 있게 되므로, 이는 주의해야 할 점이다. 불특정 다수에게 편집 권한을 부여하는 것은 보안상 위험할 수 있으므로, 기본적으로는 단순 열람을 위한 뷰어 모드를 사용하는 것이 권장된다.
홈페이지에 제품 리스트를 연동하기 위한 소스 코드는 클로드 AI를 활용하여 생성했다. 구글 공유 링크를 클로드에 전달하고, 러프하고 추상적인 질문을 던져 설계안을 도출했다. 클로드는 불필요한 요소를 제거하고 디자인 컬러 및 폰트를 지정하는 등 섬세한 작업을 수행하며, 인쇄 오류와 같은 문제도 해결하여 효율적인 코드 생성을 돕는다.
그 작업은 클로드에서 했습니다. 한 가지 먼저 좀 말씀드리면 클로드가 요즘에 점점 좋아지고 있거든요.
클로드에서 생성한 소스 코드를 아임웹 디자인 모드에 적용하는 과정이 시연되었다. IF 디자인 모드에 접속하여 기존 보유 제품 리스트 섹션을 확인하고, 마우스 우클릭 후 버튼 설정을 통해 특정 페이지로 이동하도록 설정했다. 이후 메뉴 관리에서 신규 페이지를 추가하고, 해당 페이지의 코드 설정에 클로드에서 생성한 소스를 붙여넣으면 연동이 완료된다.
연동된 제품 리스트 페이지의 효율적인 노출을 위해 메뉴 숨김 및 상단 숨김 설정을 적용할 수 있다. 이는 설정에 있는 메뉴 숨김과 상단 숨김 옵션에 체크하는 방식으로 이루어진다. 이 설정을 통해 상단 로고와 카테고리 섹션을 제거하여 제품 리스트 자체에 집중할 수 있도록 페이지를 구성할 수 있다.
클로드와 같은 유용한 AI 툴이 등장하기 전에는 이러한 페이지를 직접 홈페이지에 구현하려면 지퍼백 이미지 비율을 하나하나 디자인하고 코딩하는 등 많은 수작업이 필요했다. 하지만 이제는 아이디어만 있으면 AI를 통해 이러한 복잡한 작업들을 쉽게 구현할 수 있게 되어, 홈페이지 제작 및 관리 환경이 혁신적으로 변화했다.
하마교실은 일방적인 강의가 아닌, 수강생과 함께 홈페이지 하나를 끝까지 만들어보는 과정으로 구성된 '수업' 개념을 지향한다. 이 수업의 목표는 수강생의 사업에 실질적으로 도움이 되는 홈페이지를 구축하고, AI를 활용하여 내부 관리 시스템을 직접 운영할 수 있도록 돕는 것이다.
하마교실은 많은 수강생을 모아놓고 온라인 강의를 진행하기보다는, 클래스당 3명으로 소수 정예로 운영하며 깊이 있는 대화와 실질적인 도움을 제공하는 구조를 추구한다. 현재 용인 캠퍼스에서 오프라인 6시간 수업과 30일간의 온라인 코칭을 병행하여 진행하고 있다.
강사는 웹 에이전시 경험보다는 소상공인 및 중소기업의 브랜딩과 마케팅 분야에서 주로 활동해왔다. 와디즈 펀딩, 국내외 전시회 참여 등 실제 사업 경험을 바탕으로 수강생들에게 현실적인 조언과 노하우를 공유한다. 수업 신청 전에는 사전 전화 및 카톡 상담을 통해 수강생의 필요를 파악한 후 최종 결정을 안내한다.
Answers come from the transcript, with the exact spot cited.
Want the next one from this channel too?
When 클로드 + 아임웹으로 만드는 홈페이지 제작 publishes, we'll write it up like the one you just read and email it to you.
{channel} published 1 in the last 7 days.
We skip Shorts. You can unfollow any time.
챗GPT, PDF 파일로 웹페이지 초안 자동 생성…클로드에 도전장클로드 + 아임웹으로 만드는 홈페이지 제작3 weeks ago · 9:07 · 173 views · Created 2 weeks ago
Inside Cursor: A Generational Startup's Journeya16z40 minutes ago · 38:34 · 1.6K views · Created 29 minutes ago
KV Cache-Aware Routing and P/D Disaggregation on KubernetesAI Engineer1 hour ago · 21:47 · 93 views · Created 59 minutes ago