Search
Duplicate
Share
YangPhago’s Mains(양파고)
배움을 나누고, 성장하기 위한 노션 페이지입니다_By Yang, Since 2023
*
주인장의 한마디: 어려운 인공지능을 많은 사람들이 보다 쉽게 이해할 수 있도록 ‘Connect’해주는목적으로 개설된 페이지입니다. **주인장 깃허브:
https://github.com/roughkyo
***강의문의: roughkyo@gmail.com
It’s Me: AI teacher, AI education connector, Toy Project Developer
Philosophy: AI education is needed for everyone
1.LLM(tools)
AI실습&체험 사이트 ALL
LLM tools
바이브코딩
MCP&skills
GPTs&Gems&Agent
2.AI_Python
CNN관련
데이터 수집 사이트 ALL
강화학습
최신 논문&도서 Review
3.Pure programing
Git&Git Hub
HW(아두이노, micro python)
Web_base
Python
중급(크롤링, 자동화, 스트림릿등)
잡기술
4.Human(Non codebase)
E.T.C
SW
EduTech
투자
해커톤
MY Career
5.Real Project
py_project_issue
project_with_Cursor
[Hot Trend]
목차(클릭하세요)
26년을 준비하며 가장 공들였던 프로젝트 - RAG기반의 자공고2.0 이수트랙 AI추천 시스템
[양파고의 철학]
1. 바이브코딩 자체가 중요한 것이 아니라 바이브 코딩을 통해 내게 필요한 것을 만들자 2. 개인에게 유용하면서도 보다 많은 다수(학생/교사들)에게 가치로운 프로그램을 만들자 3. 이 과정 역시 학생들의 주제탐구에 하나의 방향으로 제시될 수 있도록
광양고 자공고 2.0 - 이수 트랙 추천 시스템
광양고등학교 자율형 공립고 2.0 맞춤형 이수 트랙 추천 시스템입니다.
1. 프로그램 개발의 취지
1-1. 학생들에게 필요한 기능/전략
•
학교가 자율형 공립고라서 정말 많은 비교과 프로그램이 운영중임
•
효율적인 내신관리를 위해 본인의 희망 진로에 맞는 적합한 프로그램을 추천받을 수 있는 기능
•
단순 추천이 아닌 AI에 의한 분석후, 보다 전략적인 추천기능을 제공
1-2.담임 선생님들의 상담 및 진로상담 효율성 제고
•
사실 담임선생님들의 너무많은 행정부담으로 학교에서 진행중인 모든 프로그램을 아는 것은 쉽지 않음
•
학생들과 상담전에 해당 프로그램을 통해서 어느정도 본교에서 운영중인 프로그램을 파악하고, 보다 원활한 진로교육에 도움이 될 수 있을 것으로 판단
•
아무것도 모르고 있는 학생들과 상담하는 것 보다 어느 정도 비교과 프로그램을 알고 있는 상태의 학생들과 상담하게 할 수 있다면 담임선생님의 부담도 경감시키고, 보다 효과적인 진로상담이 가능 해질 것
1-3. 추천 로직 시각화
[안티그래비티]고등학교용 이수트랙
main_page
목차(클릭하세요)
안티그래비티로 모든 담임 선생님들의 로망: 진실의 자리바꿈을 구현해보자! 진실의 자리 바꿈이란?
같이 앉으면 안되는 학생들을 미리 셋팅하여 원활한 자리배치가 만들어지는 시스템
[배포 페이지]
•
클릭해서 전체 파일 확인가능!
class-seat-manager
[시작전 주의사항]
•
기능이 완벽하지 않을 수 있습니다. 수정을 원하시면
•
[안티그래비티]진실의 자리바꿈(로컬용)
을 참고하세요!
1. 래퍼런스 자료 찾기
•
자리바꾸기 프로그램 샘플을 찾아서
1-1. 전설중의 전설: 김명식 허명성의 과학사랑
•
김정식 수석 선생님의 자리바꾸기, 아마 교사라면 한번쯤
은 이 프로그램을 보지 않았을까?
[안티그래비티]진실의 자리바꿈(배포용)
main_page
목차(클릭하세요)
바이브 코딩 결론: 코드 짜는것 보다 해당 퀴즈게임에 들어갈 이미지를 생성하는데 더 많은 시간이 소요됨 이는 MCU관련 저작권으로 인해 직접적인 캐릭터 생성이 잘 안되기 때문
무엇보다 필요한건 집요한 프롬프팅을 통한 오류 수정
완성작 맛보기
•
이 작품은
전라남도 창의융합 교육원의 ‘2026. 동계 교원 교육정보화 연수’ 나승엽 선생님의 연수내용을 기반으로 변형
되었음을 밝힙니다’
marvel-quiz
[깃허브]
GitHub - roughkyo/endgame_test
Contribute to roughkyo/endgame_test development by creating an account on GitHub.
1. 바이브 코딩 전 체크 포인트(=사전준비)
1-1. 교육용 퀴즈게임이 목적이므로 문제은행(=DB) 사전 준비 및 연동
1.
앱스스크립트를 사용하는 방식
2.
웹에 게시된 CSV를 사용하는 방식
3.
하지만 추후 업그레이드를 위해 앱스 스크립트 방식을 권장
1-2.캐릭터 이미지를 asset으로 사전 준비
[안티그래비티]endGame_교육용퀴즈
main_page
목차(클릭하세요)
안티그래비티로 모든 선생님들의 로망: 진실의 자리바꿈을 구현해보자! 진실의 자리 바꿈이란?
같이 앉으면 안되는 학생들을 미리 셋팅하여 원활한 자리배치가 만들어지는 시스템
[깃허브 페이지]
•
클릭해서 전체 파일 확인가능!
magicarrayseat
roughkyo
[시작전 주의사항]
•
기능이 많다보니 절대 한번에 완성될 수 없음을 인지하고, 중간중간 브레이크 포인트로 저장
1. 래퍼런스 자료 찾기
•
자리바꾸기 프로그램 샘플을 찾아서
1-1. 전설중의 전설: 김명식 허명성의 과학사랑
•
김정식 수석 선생님의 자리바꾸기, 아마 교사라면 한번쯤은 이 프로그램을 보지 않았을까?
•
리스펙! 그 잡채!
자리바꾸기 5.3 공개- 모둠별 자리 배치, 남녀자동 자리 배치 가능
2025.3.13>윈도우11에서 자리바꾸기 실행이 아예 안되는 선생님은 본문 맨아래 새로 올려 놓은 프로그램 다운 받아서 실행하세요. 불편하지만flashplayer_32_sa.exe 를 이용하여 실행하는 방법이 있습니다. 추후에 업그레이드 하도록 하겠습니다. 자리바꾸기 프로그램 탄생 15주년 기념으로 자리바꾸기 5.0을 공개합니다.(참고로 자리바꾸기 프로그램은 2002년에 1.0이 처음 개발되었습니다.)저에게는 갤럭시 S10 공개하는 것 같은 느낌이 드네요무엇을 상상하든 그 이상이 되도록 개선했습니다. 몇가지 문제가 발생했던 것 수정해서 최종버전을 공개합니다. 몇일전 다운 받으신 선생님은 다시 다운 받아 사용하세요 1. 책상배치가 가능해 졌습니다.,(모둠별 배치나 ㄷ 자 배치도 가능합니다.) 2. ..
[안티그래비티]진실의 자리바꿈(로컬용)
main_page
목차(클릭하세요)
3D 컴포넌트 템플릿을 프롬프트에 포함하여 바이브 코딩하기 vs 3D컴포넌트 템플릿을 생성할 수 있는 리액트 라이브러리를 프롬프트에 포함하여 바이브 코딩하기
[참고 영상]
YouTube
(코딩X) 진짜 미쳤습니다... 500만원짜리 3D 웹사이트 구글 최신AI 제미나이로 딸깍하는법 알려드립니다
1. 기초 방법
바이브코딩을 위한 디자인툴 2인방(스플라인, 모빈)
바이브코딩을 위한 디자인툴 2인방(스플라인, 모빈)
1-1. 3D디자인과 웹디자인을 레퍼런스로 제시
•
이미 준비되어 있는 템플릿과 콘텐츠를 가져오기
1.
스플라인에서 원하는 애미네이션을 선택
•
예시 디자인
1-2.구글 AI Studio에서 작업해보기
•
구글 AI studio의 ‘build’를 선택한 다음
[바이브코딩]2.3D웹사이트구축
main_page
목차(클릭하세요)
요즘 핫한 클로드 extension 꼭 사용해보고 싶은 이유: 클로드를 사용해서 했던 프로세스를 하나의 ‘작업화’를 하게 되면
동일한 작업을 일정별로 반복실행할 수 있음
1. Chrome용 Claude
1-1. 개념
•
Chrome용 Claude: Anthropic이 제공하는 브라우저 확장 프로그램으로, 웹 페이지의 내용을 직접 읽고 분석할 수 있는 AI 어시스턴트
[핵심 기능]
•
현재 보고 있는 웹 페이지의 텍스트, 이미지, 구조를 실시간으로 분석
•
페이지 내용을 기반으로 즉각적인 질문 답변, 요약, 번역 가능
•
복잡한 웹 데이터를 구조화하여 추출 및 가공
•
코드 분석 및 디버깅 지원
[
기존 Claude와의 차이점
]
•
일반 Claude: URL을 주면 웹 검색이나 웹 페이지 가져오기 도구를 사용
•
Chrome용 Claude: 브라우저에서 실시간으로 렌더링된 페이지를 직접 "보면서" 작업
•
노션 작성, 스프레드 시트 작성, 구글 폼 응답 등 다양하게 활용가능
Chrome용 Claude
main_page
목차(클릭하세요)
워크플로우는 특정 작업을 수행하기 위한
단계별 지침서
양파고 제작 PPT자동화 깃허브
ppt_auto_gemini
roughkyo
1. 안티그래비티+PPT자동화를 추천하는 이유
•
현재 PPT자동화로 노트북 LM과 gemini를 사용하는 경우가 많은데 완벽하지 않고, 수정이 더 번거로울때가 있음
1-1. 노트북LM에서의 슬라이드 작성시 문제점
생성된 슬라이드 초안을 내부 UI에서 직접 수정하기 어려움
•
무엇보다 중간중간 깨지는 슬라이드가 있고, 한글표현이 100% 완벽하지 않음
1-2.Sam을 이용한 방법도 있긴한데 이것도100%는 아님
SAM 기반 오브젝트 분리
•
Segment Anything Model(SAM)을 활용하여 이미지 내 특정 객체를 추출하여 변경할 수 있으나 완벽하지 않음
1.
분리 정확도 저하
: 복잡한 배경이나 객체 간 경계가 모호한 경우 모델이 오브젝트를 완벽하게 식별하지 못함.
[안티그래피티] PPT 자동화
main_page
목차(클릭하세요)
워터마크 없는 나노 바나나 pro 역시 gems의 oapl기능을 활용해야
1. super Gems추가
•
super Gems를 통해 사용가능: gems 클릭 후 ‘New Gem’클릭
•
Gem 관리자 쪽
에 있는 ‘뉴잼’이 아닌
My Gems from Labs
쪽의 New Gem클릭
•
프롬프트 예시
1-1. Gems 생성을 opal수정
•
모델 변경을 위해
‘Open Advanced Editor’클릭
하면 opal 편집창이 열림
1-2.체크해야 될 2가지 point
•
나노 바나나는 기존 이미지 생성 모델들과 달리 한글 텍스트 표현이 90%이상 자연스러움
•
opal과 연결된 super Gems를 사용하므로 오른쪽 하단에 제미나이 워터마크가 없음
워터마크 없는 나노바나나 이미지 생성with superGems
main_page
목차(클릭하세요)
[참고 영상]
Gemini + 노트북LM + 구글 opal. google 제미나이가 AI를 먹는 중입니다!
Gemini + 노트북LM + 구글 opal. google 제미나이가 AI를 먹는 중입니다! *** 이미지 프롬프트 및 쳇지피티로 쉽게 프롬프트 생성하는 방법 강의 판매중입니다! https://litt.ly/levelupclass *** 구글 오팔 opal 재생 목록 입니다! https://www.youtube.com/playlist?list=PLPPESFmCt34GJLJisppTR1vrUHJ6Yy8yf **** 00:12 제미나이 노트북 LM 차이점 05:56 제미나이 ppt 06:03 내 PDF 자료 업로드 사용법 11:38 gemini에서 구글 opal 사용하기 #노트북LM #NotebookLM #제미나이 #Gemini #GeminiAI #AI비교 #AI차이 #AI활용 #AI사용법 #AI공부 #AI리서치 #지식관리 #지식저장 #PDF업로드 #PPT제작 #AI업무 #AI생산성 #공부도구 #업무자동화 #콘텐츠기획 #유튜브기획 #유튜브알고리즘 #정보정리 #노션대안 #AI도구추천 #AI워크플로우 #AI학습 #AI노트 #리서치도구 #AItools #AIworkflow #KnowledgeManagement #AIProductivity #ContentCreator #DigitalNotes #AIforStudy #aiforwork #google
1. 구글 재벌집 3형제의 관계
1-1. 중심은 Gemini
•
노트북 LM에서 사용하는 것과 무엇이 다른가?
•
gemini 실행 후 내가 기존에 만들어 놓은 노트북LM을 선택할 수 있음
•
즉,
파편화된 나의 노트북LM 소스를 한방에 모조리 불러와서
작업을 할 수 있음!
1-2.
Gemini+ NotebookLM
•
최대 단점은 역시나 RAG에 제미나이 3.0 모델을 쓰기 때문에 답변이 많이 느릴 수 있음
Gemini+ NotebookLM+ Opal(superGems)
main_page
목차(클릭하세요)
바이브 코딩시에 만들어지는 웹 페이지의 느낌이 다 고만고만하기 때문에 시각적 요소를 더하기 위한 사이트: 스플라인 + 모빈
1. 3D디자인_스플라인
•
3d랜딩 페이지 제작을 위한 사이트
•
메인 베너 디자인을 3D디자인으로 구성하고 싶을 유용
•
브라우저에서 실시간으로 돌아가는 도구
Spline
Spline is a collaborative design platform for creating production-ready interactive experiences in multiple dimensions.
1-1. 커뮤니티 활용
•
일반 사람들이 만든 디자인을 서로 공유하는 곳
1-2.실제 remix과정
•
remix버튼을 눌러 일부 텍스트나 간단 수정이 가능함
[바이브코딩]1.디자인툴 3인방(스플라인, 모빈, 비핸스)
main_page
목차(클릭하세요)
구글이 만든
안티 그래비티
(=
Antigravity)와
구글이 만든 파이어베이스(=
FireBase)
가 만나면? -
안티 그래비티
(=
Antigravity)
가 딜러+힐러라면 - 파이어베이스(=
FireBas
는 서포터!!!
1. 고민_서비스 배포는 어떻게?
1-1. 하나의 생태계에서 프론트엔드와 벡엔드의 만남
•
안티그래비티 (아이돌):
춤추고 노래하며 실제로 퍼포먼스(기능 구현)를 보여주는 주인공.
•
파이어베이스 (기획사):
무대(호스팅)를 설치해주고, 팬레터(데이터)를 관리해주는 소속사.
핵심 요약표
1-2. 대표적인 배포 방법
•
firebase가 유리한 이유: 트래픽이 많지 않으면 무료 호스팅 가능
•
22년 6월 기준, 파이어베이스는 무료호스팅으로 10GB, 일 360MB의 데이터를 전송할 수 있음
1-3.구글 파이어베이스 기반 배포 시작을 위한 사전 준비
[안티 그래비티(Antigravity)] 2.배포
with Firebase
main_page
목차(클릭하세요)
구글은 진심으로 다르다..뭐가 다르냐구? [point1] VSC가 폴더별 관리를 지향한다면, Antigravity는 에이전트별 관리를 지향한다는 느낌
여러개의 에이전트가 각각 다른 프로젝트의 코딩 수행을 ‘동시’에 해줌 [point2] vsc가 code edit화면이 주라면, Antigravity는 Agent Manager가 주가 된다는 느낌
테슬라의 FSD와 Autopilot의 차이랄까?
[참고 영상]
드디어 커서 지웠습니다. 결국 구글이 이겼네요. 안티그래비티 Antigravity
Antigravity는 현존하는 가장 혁신적인 AI 협업 툴입니다. AI UX에 대한 구글의 생각이 아주 잘 담겨있습니다. 📕 국내 최초 클로드 코드 완벽 가이드 https://bit.ly/4lEuMvd ✉️ 최신 AI및 프로그래밍 무료 메일링 리스트 https://page.stibee.com/subscriptions/437644 ⭐️ 코드팩토리 통합링크 (모든 강의 및 서적) ⭐️ https://links.codefactory.ai 👉 바이브코딩 오픈톡방 https://open.kakao.com/o/gDUhYNDh 👉 NestJS 마스터클래스 https://bit.ly/fcnestjs 👉 플러터 초급 https://inf.run/Sjuw 👉 플러터 중급 https://inf.run/hf1E 👉 Typescript 마스터 클래스 https://inf.run/3r8Jd 👉 플러터 서적 (3판) https://bit.ly/4gXg1li
1. 다운로드
•
자신의 운영체제에 맞는 안티 그래비티 설치
1-1. 설치후 최초 실행시 설정
•
vsc 기존 사용자에 따라 달라질 수 있음
•
안티그래비티 에이전트 설정 부분: 잘 모르겠으면 ‘recommended’설정 선택
•
모든 설정이 끝난 첫화면
1-2.중요옵션1: planning vs Fast
[안티 그래비티(Antigravity)] 1.설치법 & 사용법&단점 &MCP
main_page
목차(클릭하세요)
이걸 어떻게 쓸 수 있을까?에 대한 보다 생산적인 고민이 필요
[참고]
요즘 난리난 Google Gemini ‘나노 바나나’ 실전 활용 예제 TOP 10 (+프롬프트 공개)
요즘 나노바나나 프로가 화제인데요! 나노 바나나를 누구나 야무지게 활용할 수 있는 방법을 모아 정리해 봤습니다! 좋아요로 저장해두고 직접 만들 때 참고해보세요! '본 콘텐츠 결과물들은 모두 Google AI Ultra 요금제를 사용하였으며, SynthID 디지털 워터마크가 삽입되어 있습니다' 조코딩의 프롬프트 모아보기 : https://docs.google.com/document/d/1IBqk6UDQD81HayuPwFR-vG25x8GX3uel5_-9sUYFcH0 ✅ 조코딩 강의 모아보기: https://jocoding.net/ 🕖목차 00:00 나노바나나 프로 업데이트 00:27 실습 1 - 스튜디오 사진 및 광고 포스터 만들기 02:09 실습 2 - 셀카 하나로 전문 프로필 만들기 03:48 실습 3 - 오래된 사진 복원하기 04:27 실습 4 - 쇼핑하기 전에 핏 미리 확인하기 05:12 실습 5 - 딸깍으로 웹툰 작가 데뷔하기 07:05 실습 6 - 이미지 전체 번역하기 07:42 실습 7 - 로고 디자인 및 브랜드 목업 만들기 08:35 실습8 - 우리 집 3D로 둘러보기 09:52 실습9 - 어려운 논문 강의처럼 보기 10:23 실습 10 - 산타와 찍은 사진으로 동심 지키기 #구글제미나이 #나노바나나 #제미나이 #산타프롬프트패키지 #GoogleGemini #NanoBanana #Gemini
1. 나노 바나나와 나노 바나나pro는 다르다!
1-1. 나노 바나나 pro 사용을 위한 설정
•
‘pro모드’와 ‘사고모드’는 다름
1-2. 결과물 비교
[목적] 영어로 되어있는 그림의 설명을 한글로 변환하는 작업
[결과물 비교]
2. 셀카 사진을 프로필 사진으로
나노 바나나 pro 활용법(실전 3가지)
main_page
목차(클릭하세요)
[참고 사이트]
(주)창의와교육
네이버 블로그 | 즐거움의 시작, 디바이스마트~♪
[Blynk 2.0] #1 아두이노 IOT WeMos D1 R1 & Blynk2.0으로 WiFi 제어하기 (LED 예제)
두 방식 비교표
1. Blynk란?
1-1. IoT 프로젝트를 위한 앱 빌더 플랫폼
•
스마트폰 앱으로 아두이노/ESP32 같은 하드웨어를 원격 제어할 수 있게 해주는 클라우드 기반 IoT 플랫폼
•
기존 예제와의 차이점?
1-2.
Blynk의 주요 구성 요소
Blynk 2.0 서비스는 크게 세 가지 부분으로 작동
•
Blynk App & Web Dashboard (인터페이스):
사용자가 스마트폰이나 PC 화면에서 버튼을 누르거나 그래프를 보는 곳
Blynk2.0으로 WiFi 제어하기
main_page
목차(클릭하세요)
이 페이지에서 설명하는 방식은 반드시 같은wifi에 연결필요 웹 브라우저 화면의 변경을 아두이노 안에서 html태그를 이용해 제어할 수 있음
WiFiClient클래스를 통해 client객체를 만들고, clinet객체를 조정하는 방식
[참조 사이트]
•
docs.arduino.cc
•
네이버 블로그 | 대한민국 No.1 전자부품 쇼핑몰 엘레파츠 공식 블로그
아두이노 우노 R4 WiFi - WiFi 연결하기
•
네이버 블로그 | 즐거움의 시작, 디바이스마트~♪
[Blynk 2.0] #1 아두이노 IOT WeMos D1 R1 & Blynk2.0으로 WiFi 제어하기 (LED 예제)
1.
아두이노 우노 R4 WiFi - WiFi 연결하기
1-1. 아두이노 우노 R4 WiFi를 네트워크에 연결해 원격으로 제어/데이터를 전송해보기
[주의점] 아두이노 우노 R4 WiFi는 2.4GHz 대역만 지원합니다.
(WiFi - 5GHz 사용 불가)
1-2.관련 라이브러리
•
WiFi는 사용을 위한 "WiFiS3.h" 라이브러리가 이미 존재함
1-3.예제_ SimpleWebServerWiFi
아두이노 IoT( wifi)기초예제 변형
main_page
목차(클릭하세요)
로컬스토리지 저장방식이 아닌 서버에 데이터를 저장하는 방식 활용
[결과물]
http://yangphago.atwebpages.com/index.php
0. 참고: 이 내용은 ‘
커서 AI 트렌드&활용백과
’를 참고함
1. 맞춤형 설문조사 폼&분석
•
Todo list를 로컬 스토리지에 저장하는 방식으로 구현했으니, 이제 서버에 데이터를 저장하고 활용하는 예시를 진행
1-1. 데이터를 서버에 저장하는 방식 중 SQL와 관련성이 없는 세션관리 방식 사용
•
아래 분류는 데이터베이스를 활용하는 방식과 파일 형태로 저장하는 세션방식으로 다시 구분지을 수 있음
여기서는 생성형 AI로 대략적인 설문을 만들고, 그 결과를 Json형태의 파일로 만들어 서버에 저장한뒤, 그 결과를 분석하는 기능까지 구현하기로 함.
1-2.설문조사 데이터를 Json으로 저장하는 이유?
•
Json: 전화번호 같은 텍스트 기반의 데이터를 쉽게 교환하고 저장하기 위한 형식
•
특징: Json파일은 구조화 되어 있으면, 계층형으로 되어 있음
일반 텍스트 기반의 데이터가 서술형 답안지라면, JSON은
디지털 OMR 카드에 가까움
[중급] 서버기반 설문조사 폼&분석
main_page
real Project
목차(클릭하세요)
오류가 주로 나는 부분은 다음 2가지 포인트 1. 배포용으로 만드는 과정에서 설정 2. 데이터베이스 역할을 하는 구글 스프레드시트의 탭이름
교실혁신 선도교사 연수를 진행하며, 각 학교에서 학생들의 지필 또는 수행평가를 조회하는데 있어, 자신의 점수가 아닌 타인의 점수가 노출되는 상황을 방지하는 용도로 사용됨
1.
기존의 리로스쿨에는 해당기능이 이미 포함되어 있음.
2.
시스템을 만드는 과정에서 생성형AI를 활용하여 기록된 점수를 개별조회가 가능한 시스템으로 변환하는데 그 핵심이 있음
1. 예시작품
1-1. 더미 데이터로 구성된 데이터베이스 예시(수행평가 점수)
https://docs.google.com/spreadsheets/d/1YQZiV4svwHN-t-R-7Fgxae6_k6Ec2kuekab4Em2gxzM/edit?gid=1067784270#gid=1067784270
1-2. 개별점수조회 사이트 체험하기
script.google.com
•
학생별 이름과 비밀번호를 정확하게 입력할 경우 개인별 점수가 조회되는 예시
구글 Apps Script 활용 개별점수확인
main_page
Human
목차(클릭하세요)
나온 지 얼마 안된 기술이니만큼, 매일매일 새로운 MCP 서버가 활발하게 개발 중 GPT에 MCP가 붙게 되는 날이 곧 올 듯
MCP마다 실행방식이 약간 다름: 크게 로컬에 설치하여, 인터넷 연결없이 작동되는 MCP가 있는 반면, 클라우드 기반 실행방식도 있음
1.
Smithery AI
•
Smithery AI
Smithery - Model Context Protocol Registry
Extend your agent's capabilities with Model Context Protocol servers.
1-1. 특징
•
25년 3월 기준으로 3400개의 MCP가 등록되어 있음
•
특히, Claude Desktop과의 통합이 용이
1-2.추천 MCP서버 F4
•
Sequential Thinking
- 좀 더 딥한 과제를 풀 수 있는 MCP
•
Desktop Commande
r - read_file, write_file 등을 할 수 있는 MCP
•
Perplexity Search
- 퍼블렉시티 서치를 할 수 있는 MCP
4.MCP 서버 훝어보기
LLM with gpt
main_page
목차(클릭하세요)
1. MCP환경 셋팅
•
기본적으로 파이썬, VSC는 설치되어있다고 하고 Pass!!
•
참고로 오늘날짜 25.5.2.을 기준으로
클로드 웹사이트
claude.ai
에서는 MCP 서버를 지원하지 않음
1-1.
Claude 데스크탑 버전 설치
Download Claude
Download Claude
Download Claude for your desktop or mobile device.
•
당연히 클로드 계정은 있어야 하고, 사용법을 읽고 싶다면 아래 링크 클릭
•
Model Context Protocol
For Server Developers - Model Context Protocol
1-2.초기 셋팅
•
왼쪽 상단의 파일설정 메뉴에서 개발자클릭 후, ‘
설정편집’
을 클릭
•
단축키: ctrl + ,
2.MCP 환경셋팅 및 모듈설치(클로드 기반)
LLM with gpt
main_page
목차(클릭하세요)
클라우드 드라이브에서 작업시 설치와 실행에 오류가 발생할 수 있으니, 로컬 드라이브에서 작업
0. 참고: 이 내용은 ‘
커서 AI 트렌드&활용백과
’를 참고함
1. 프로젝트 폴더와 파일 만들기
1-1. 웹 사이트의 첫페이지
일반적으로 index.html 또는 index.php 라는 이름을 사용
1-2. html과 php의 차이
핵심 비교
1-3. 웹사이트 파일들의 일반적 구조: 트리 구조
웹사이트의 트리구조 예시
/ (루트 디렉토리) ├── index.html # 메인 페이지 ├── about.html # 소개 페이지 ├── /css # 스타일시트 폴더 │ └── style.css # 메인 스타일시트 ├── /js # 자바스크립트 폴더 │ └── script.js # 주요 동작 스크립트 ├── /images # 이미지 폴더 │ └── logo.png # 로고 이미지 ├── /assets # 기타 리소스 폴더 │ ├── /fonts # 폰트 파일 보관 폴더 │ │ └── font.ttf # 폰트 파일 │ └── /videos # 동영상 파일 보관 폴더 │ └── intro.mp4 # 소개 영상
- index.html : 브라우저가 가장 먼저 읽는 메인 페이지
[초급]K치킨 소개사이트_by_cursor(Git Hub활용)
real Project
main_page
목차(클릭하세요)
먼저 깃허브에 올린 후, 상황에 따라 배포 방법을 결정!!
1. 웹 프로젝트 유형별 권장 배포 플랫폼 정리
웹 프로젝트 유형별 권장 배포 플랫폼 정리 (2025 기준)
정리표: 프로젝트별 최적 배포 플랫폼
보충 설명
GitHub Pages
•
HTML/CSS/JS 기반 정적 사이트에 가장 적합
•
외부 API를
fetch()
로 호출하는 정도의 동작은 문제 없음
•
Python, PHP, Flask 등의
서버 사이드 실행은 불가
Render
웹프로젝트 유형별 배포(Yangphago_st)
main_page
목차(클릭하세요)
한줄평: 내돈내산 할만함!! 추천
핵심 키워드: 메타도구
1. 내돈내산 review
1-1. 인증
1-2.인상깊었던 단락&표현
[메타도구]
a.
과거 노코드 도구들이 대세인적이 잠깐 있었음
b.
지금의 커서AI는 사용자의 의도를 이해하고 그에 맞춰 도구를 함께 설계,제작하는 해줌
[프롬프트 엔지니어링]
1.
우리가 흔히 알고 있는 프롬프트 엔지니어링에 대한 개념을 확장 시킨 부분이 인상적
‘
커서 AI 트렌드&활용백과
’ review
main_page
LLM with gpt
목차(클릭하세요)
한줄평: 중수이상은 내돈내산 비추천, 초보들에게는 내돈내산 할만함
1. 내돈내산 review
1-1. 인증
1-2.리뷰 한줄평
•
목차는 매력적이나 책을 풀어가는 방식은 기대만큼 매력적이 않아 아쉬움이 남음.
•
공감갔던 리뷰
2. 의미있던 부분??
2-1. VBA에 대한 기초적인 내용
1.
여러 엑셀파일을 하나로 다루는 기능을 구현하고자 할때
2.
[프롬프트 예시] 어떤 폴더에 엑셀파일이 여러개 있다. 이파일을 하나씩 열어서 첫번째 시트에 있는 내용을 복사해서 하나로 합치는 VBA코드 만들어줘]
‘챗GPT와 업무자동화 도서’ review
main_page
1.파이썬 물리엔진 시각화를 위한 라이브러리들
vpython vs pymunk 핵심 비교
사용 권장 상황
•
vpython
→ 중고등학생, 대학 기초 물리 교육 시각화
•
pymunk
→ 2D 게임 물리 구현, 충돌/역학 기반 시뮬레이션
1-1. 낙하 운동 시뮬레이션(vpython)
[주의]
해당 코드는 .ipynb이 아닌 파이썬 스크립트 형태로 실행해야 함
1-2. 낙하 운동 시뮬레이션(pymunk활용 2D)
2. pymunk라이브러리
1.
’munk’이름의 유래: Chipmunk라는 2D 물리 엔진에서 유래
파이썬_물리엔진
main_page
목차(클릭하세요)
전체 흐름: 원본파일 넣기
매크로 실행하여 원본파일 숨기기
매크로 전체 비밀번호 설정
1. 첨부파일 다운 후 원본자료 입력 후 기본셋팅
25학년도 OO고 셀프확인핑양식.xlsm
33.1KB
1-1. 첨부파일의 원본보호 탭에 조회할 전체 원본자표 입력
1-2. 조회기능 VBA
•
데이터-유효성검사에 있는 콤보박스로는 VBA작동과 매칭이 어려우므로 개발도구 안에 있는 콤보박스 기능을 활용
•
다음 순서로 콤보상자를 드래그
•
마우스 우클릭 후 컨트롤 서식 클릭
2-1. 콤보박스 만들기 VBA
•
VBA편집기 실행: 개발도구-VisualBasic 으로 실행하거나 또는 Art+F11키로 실행
VBA로 개별확인자료 배포하기
main_page
목차(클릭하세요)
확실한 효과!가 있어요!
참고 사이트:
https://oceanic-boron-955.notion.site/3-15564aa24d21808f9d12c62c093a1920
0. 최고의 조합_by_양파고
🫰
close-up,f/22, Natural lighting, shiny texture
1. 카메라/구도
1-1.일반 카메라
•
35mm lens
- 사람의 시선과 비슷한 렌즈
•
Fujifilm X-T4
- 클래식한 느낌 한스푼
•
f/22
- 사진이 선명해지는 조리개 값
•
drone camera
- 공중 카메라
•
wide angle
- 눈으로 보이는 것보다 더 넓은 구도
•
( ) framing
- 액자를 만들듯이 피사체를 둘러싸는 구도
•
bird's-eye view
- 새처럼 높은 곳에서 내려다본 구도
리얼한 이미지 만드는 비밀 공식 3단계 프롬프트
main_page
목차(클릭하세요)
쉽고 재밌기만 한 교육은 독이다. 재미있으니까 교육에 쓰자는 말로 에듀테크를 합리화 해서는 안된다. 에듀테크는 사용하기전 사용의도가 반드시 존재해야 한다. 이븐하지 않은 교사들이 단지 재미를 위해 에듀테크 사용을 권장한다면, 다시 생각해 보자 By 자칭 Edu슐랭 3Star
[참고 문헌1]:
ㅍㅍㅅㅅ
쉽고 재밌기만 한 교육은 독이다
[참고 문헌2]
Brunch Story
10화 [브런치북] 쉽게 가르치고 쉽게 배워야 한다?
** 이 원문글이 너무 좋아 글의 일부를 차용하되, 저자의 생각을 덧붙임
1. 재미있는 학습에 대한 회의
1-1. 다음 2가지 강의(수업)상황 중 무엇이 더 나쁠까?
•
상황1. 재미는 있는데, 듣고나면 뭘 들었는지가 생각이 안난다
•
상황2. 들을때는 괴로웠는데, 자꾸 그 때 들었던 그 내용을 찾아보고 싶고 관심이 생긴다.
1-2. 강사(교사)의 가치
•
재미있는 연수라.. 너튜브에만 가도 흘러 넘치는 유머러스한 영상
•
정말 시간내서, 얻고 가는게 없다면, 단순히 재미있었던 그 수업은 어떤 가치가 있을까?
교육의 본질을 회피하지 말자.
AI교육에 대한 철학
Human
main_page
목차(클릭하세요)
오늘의 핵심: 프롬프트 뒤에 반드시 ~~~을 붙여보자.. 훨씬 더 신뢰있는 대답을 얻을 수 있습니다
신뢰성 있는 대답을 얻는다는 것은 곧 할루시네이션을 피할 수 있다는 의미
1. 요즘 들어 부쩍 수상해진 GPT
•
오늘의 프롬프트는 미국의 핫한 7대 기술주(=우리는 이것을 매그니피센트 7)가 가진 특징, 트레이드 마크, 어떤 부분에서 혁신적이였는지?에 대한 것들
•
기준일: 2024.2.28, 이때는 매그니피세트7의 기세가 하늘을 찢을 듯한..
•
동일 프롬프트
1-1. GPT
•
GPT4를 사용하는데도 왜 이럴까요? 나 한국인이거 반영한거야?
•
GPT-3.5로 물어보면.. 23년 자료는 반영안되었을테니. 결과가 뻔함
•
더 이상 대화가 안될 듯 하여 다른 플랫폼의 생성 답변을 확인해 보기로.
1-2. not GPT
6.GPT신뢰를 얻는 가장 확실하고 간단한 비기
LLM with gpt
main_page
목차(클릭하세요)
R4버전을 오류없이 사용하려면 IDE버젼을 최신으로 유지해야 함
1. R4를 구매하는 결정적 이유
1-1. 매우 매력적인가??
•
물론, 마이크로 비트를 모방했다하면 할말이 없겠지만
1-2. 테트리스 애니메이션으로 test
docs.arduino.cc
A step-by-step guide to install the board package needed for the UNO R4 WiFi board.
•
UNO R4 WiFi에는 테트리스 애니메이션이 사전 로드되어 있음
•
애니메이션을 test해보기
2. LED 제어 익히기
docs.arduino.cc
Get off the ground with the Arduino UNO R4 WiFi built-in LED matrix. Learn the different techniques for controlling it, create animations, graphics or even games.
2-1.
UNO R4 WiFi LED 매트릭스 사용의 전체흐름
Uno R4 시작하기
Human
main_page
목차
정확한 Test를 위해 BrowserPilot을 플러그인으로 사용하는 GPT4모델을 사용
테스트일자: 24년 2월 1일
0. 이 Test를 하게 된 계기
•
https://n.news.naver.com/article/214/0001327910?cds=news_edit
•
과연 이 기사처럼 GPT는 황당한 답변을 할까?
•
24년 1월 31일 기사
1. 간략 질문
1-1.한국어로 질문
•
질문: 독도는 어느 나라,국가에 소속된 땅이니?
•
추가 질문: 너의 그 대답은 정확하니?
5.GPT 헛소리 사례2-독도
LLM with gpt
main_page
목차
GPT를 맹신하면 안되는 이유
여기서 제시하는 GPT 헛소리(=할루시네이션) 사례는 최소 2번 이상 GPT의 답변이 이상한 경우 작성되었음을 밝힙니다!
세종대왕 맥북 사례처럼 절대 헛소리를 유도한 인위적인 상황도 배제함!
1. 헛소리 사례-왜도
•
평균(mean), 중앙값(median), 최빈값(mode)을 공부하다보면 음의 왜도, 양의 왜도와 같은 개념이 등장
•
해당 개념에 대한 사례, 예시를 들어달라고 하자 GPT가 헛소리를 시전하는데.
•
이런 중요개념을 헷갈리면 강의자료로서의 GPT답변은 신뢰할 수 없다는 이야기!!
1-1.해당 개념에 대한 이해
•
GPT 답변을 보기전 해당 내용을 개략적으로 확인해보자!
•
음의 왜도는 그래프가 오른쪽으로 치우쳐 있고, 왼쪽으로 데이터 꼬리가 가늘고 길게 늘어남
•
음의 왜도는 평균값보다 최빈값이 큰 경우
소득 분포는 양의 왜도일까? 음의 왜도일까?
당연히,
고소득층이 소수이므로, 최빈값이 적고, 평균은 높은 양의 왜도에 해당
이 말이 어렵다면, 쉽게 말해, 고속득자의 비율이 중위소득자비율보다 작다고 생각하면 됨!
4.GPT 헛소리사례1-통계
LLM with gpt
main_page
WithGPT
Total Plugins
목차 안내
1. With Plugin 사이트 안내
•
ChatGPT의 GPTs 및 Plugin 관련 모든 정보를 제공
•
원하는 GPTs나 플러그인을 검색할시 매우 유용
2. 사이트 이미지
3. 추천하는 플러그인 3형제
•
현재 GPT4유료 서비스의 플러그인은 최대 3개까지 지정 가능
•
주인장의 강력 추천: 써보면 알게 됨!
만능 플러그인 3가지
AI Diagrams: 마인드맵, 알고리즘 작성시
Browser Plot : 웹페이지 검색결과 바탕으로 답변
Wolfram : 수학 함수 그래프 그릴 때
3.GTPS &플러그인 안내 사이트 및 비교질?
LLM with gpt
main_page
목차(클릭하세요)
[참고 주소]
구글 Colab과 Github 연동하는 방법
📚 목차 Step 1. Github 리포지토리 준비 Step 2. Access 토큰 생성 Step 3. 코랩의 드라이브 마운트 Step 4. Github 커밋용 폴더 생성 Step 5. 디렉토리 변경 Step 6. Git 클론 Step 7. Git 접근권한 부여 Step 8. Commit 테스트 Step 1. Github 리포지토리 준비 구글 코랩(Google Colab)과 연동할 리포지토리(Repository)를 준비합니다(그림 1). Step 2. Access 토큰 생성 Step 2-1. 개인 Setting 콘솔 접근 우측 상단 프로필 클릭 - Settings 순으로 클릭합니다(그림 2). Step 2-2. Personal access tokens 접근 좌측에 Personal access tokens..
1.
Github 리포지토리 준비
•
구글 코랩(Google Colab)
과 연동할
리포지토리(Repository)
를 준비
2. Access 토큰 생성
2-1. 개인
개인 Setting 콘솔 접근
2-2. 개발자 셋팅으로 이동
2-3.
Personal access tokens 생성
2-4. 토큰 생성하기
2.
구글 Colab과 Github 연동하기
main_page
programing
목차(클릭하세요)
0. 핵심 요약
① git 설치
② GitHub 접속 repository(저장소) 만들기
③ 로컬의 프로젝트파일과 깃허브 연결하기
참고로 GUI로 사용하는 방식과 CLI로 사용하는 방식이 있음
[GUI]방식으로 사용하기
1.
해당 레파지토리 사이트에서 키보드 .을 누르게 되면 .dev주소가 열림
2.
여기서 수정 후 commit + push 할수도 있음
1. Git설치
1.
git과 git hub의 개념, 차이
2. 저장소 만들기
1.
레포지토리?
2.
레포짓 생성 후 해당 레포짓의 주소를 복사
1. 깃허브 핵심 요약(찐)
main_page
programing
완료
1.LLM(tools)
2.AI_Python
3.Pure programing
4.Human(Non codebase)
5.Real Project
취약점 발견 및 대응방안
1.GPT’s prompt확인
•
테스트 결과
2.취약점 보안을 위해
3.학습시킨 파일리스트 확인
It's so stupidly easy to leak gpts and its files.
2.GPTs 해킹(=보안취약점) 이슈
LLM with gpt
main_page
원본코드를 colab에서 실행한 관계로 vscode나 로컬 쥬피터환경에서 실행할 경우 코드일부와 파일경로 변경이 필요하니 참고용으로만 봐야합니다.
목차
[깃허브 레포지토리]
Bidenvsblowing
roughkyo
[참고]
https://www.ddanzi.com/index.php?mid=free&document_srl=751414970&statusList=HOT%2CHOTBEST%2CHOTAC%2CHOTBESTAC
1.데이터셋과 프로젝트의 목적
1.
데이터셋
•
본인이 직접 "날리면"과 "바이든", "알 수 없는" 음성 데이터를 각각20개씩 녹음
•
총 60개의 데이터
•
음성 녹음의 정교성을 올리기 위해 골드웨이브 사용
바이든vs날리면
real Project
main_page
[AI 수업을 위한 사이트 모음]
종합서비스, 1티어, 1.5티어, 에이전트, 생기부 특화 등
패들렛 활용 정리
Padlet
생성형AI 즐겨찾기
클릭
생성형AI 즐겨찾기
Padlet으로 만듦
[패들렛 페이지 주인장의 한마디]
•
계속 업데이트 예정
양파고’s 생성형AI 즐겨찾기
클로버 노트, 만능 툴킷, 업무효율화, 학습자료, class 관리 등
교육용 에듀테크 활용 정리
•
정말 엑기스만 모읍니다!!
Padlet
에듀테크 수업 플랫폼 마인드맵
클릭
에듀테크 수업 플랫폼 마인드맵
Padlet으로 만듦
[패들렛 페이지 주인장의 한마디]
•
계속 업데이트 예정
양파고’s 에듀테크 즐겨찾기
목차(클릭하세요)
이미지에서 벡터로의 변환 시뮬레이션 | Claude
이미지에서 벡터로의 변환 시뮬레이션 - React component created with Claude.
클로드3로 구현한 실습용 사이트
image2vector(with claude)
목차(클릭하세요)
3가지 방식: DeepL, 구글 Gems, 안티그래비티 과연 무엇이 가장 정확한 번역이 가능할까?
실험 결과: 완벽한 번역tool는 아직 없는 걸
오늘의 테스트 문서는 GPT의 조상님! 바로 attention영어논문
•
이미 한글로 번역된 자료가 많지만 테스트를 위해 어느 정도 용량이 있는 영어논문pdf를 활용해보기
1. DeepL
텍스트 및 전체 문서 파일을 즉시 번역하세요. 개인과 팀을 위한 정확한 AI 번역. 매일 수백만 명이 DeepL 번역기로 작업합니다.
DeepL 번역: 세계에서 가장 정확한 번역기
1-1. 결과
attention논문_deepL번역.pdf
950.1 KiB
1-2.아쉬운점
•
pdf 번역 하나로 한달간 사용가능한 토큰을 모조리 소비하는 듯
•
좋은점?
•
이미지 속의 영어 단어도 한글로 어느정도 완벽하게 번역해줌, 무엇보다 틀이 깨지지 않음
한글PDF를 영어PDF한방변환 비교
목차(클릭하세요)
AI큐레이션 사이트도 정말 무궁무진하게 많음
1.Toolify
최고의 AI 도구 디렉토리 및 AI 도구 목록 - Toolify
Toolify는 최대 규모의 AI 도구 디렉토리 및 GPTs Store Apps. 27700+ 개 이상의 AI 웹 사이트 및 AI 도구. AI 도구 목록 및 GPT 스토어 앱 목록은 ChatGPT에 의해 자동으로 업데이트됩니다.
2.ToolAI
ToolAI - Discover Best AI Tools & Websites Directory
Discover the best AI tools and websites updated daily at ToolAI. Explore 1000+ Artificial Intelligence platforms, software, and resources for writing, design, coding, and more.
3. AI판
AI 사이트 모음 2026 | AI판
2026년 최신 AI사이트 모음 - 영상, 텍스트, 이미지, 음성 생성 AI 서비스를 한눈에 비교·분석하세요.
4. There's An AI For That (TAAFT)
1. AI큐레이션 4인방
목차(클릭하세요)
AI와 함께 코딩, 개노다로 2일간 약 30시간을 투자해 만든 한국인을 위한 Attension 메카니즘 체험시뮬레이션(코파일럿이 짱
-원래는 클로드의 아티팩트나 구글 제미나이 캔버스로 구현하려고 했으나 코드가 3000줄이 넘어가는 관계로 코파일럿으로 구현 후, 깃허브 탑재
🤖 어텐션 8단계 시뮬레이션_Made By Yangphago(with Copilot)
Attention메커니즘을 한국의 학생들이 보다 쉽게 이해할 수 있도록 구현한 시뮬레이션 사이트(일종의 explainer)
[참고문헌]
1.
Towards Data Science
Transformers Explained Visually (Part 1): Overview of Functionality | Towards Data Science
2.
[CS224n] Transformers: 셀프 어텐션, 멀티 헤드 어텐션, 포지셔널 임베딩 등
3.
TISTORY
Attention Mechanism (어텐션 메커니즘)의 거의 모든것(1)
4.
모두의연구소
어텐션 (Attention) | 모두의연구소
5.
TISTORY
예제로 보는 트랜스포머/어텐션 (Attention is All You Need)
[코드 전체]
Transformer속 핵심 Attension 시뮬레이션(with YangPhago)
목차(클릭하세요)
1차시: RNN 체험 사이트 - 순서대로만 읽는 AI | Claude
체험형 RNN 학습 사이트로 AI가 문장을 이해하는 전 과정을 직접 경험해보세요! 토큰화부터 예측까지 단계별 실습. Built with Claude AI
RNN기초개념 실습
목차(클릭하세요)
우리는 왜 디지털 논리회로 실습을 하였을까?
인터랙티브 NAND 게이트 시뮬레이터 | Claude
Build interactive NAND gate circuits! Visualize logic gates, toggle inputs, see real-time signal flow & truth tables. Built with Claude AI.
1. 컴퓨터는 결국은 0과 1의 조합 - 양자컴퓨터 제외 - 모든 컴퓨터, 스마트폰, 심지어 인공지능 칩도 결국 ‘0’과 ‘1’로 작동함. - 디지털 논리회로는 이 0과 1을 계산하는 컴퓨터의 두뇌 회로 설계도임. 2. 컴퓨터의 동작은 대부분 논리 회로로 표현가능 - 예를 들어, "체력이 0이고 적이 가까이 있으면 도망가라!"는 것도 논리 회로로 표현 가능함
퍼셉트론으로 논리게이트 시뮬레이션
[주인장 소개]
삼성 주니어SW아카데미 교재 집
정보교육 유공교원
모두를 위한 인공지능 원격연수 (중앙교육연수원) 개발
모두를 위한 인공지능 언플러그드
연구실적 2등급