[!INFO] 책 정보
- 저자: 저자/서승완
- 번역:
- 출판사: 출판사/스마트북스
- 발행일: 2025-03-28
- origin_title: -
- 나의 평점: 7
- 완독일: 2025-04-20 00:00:00
커서AI 트렌드&활용백과
Summery
- 커서 AI를 활용하여 코딩 없이도 업무를 자동화하고 생산성을 향상시킬 수 있다는 점이 강조됨.
- 특히 비전공자도 쉽게 커서 AI를 활용할 수 있다는 점이 특징적임.
- 커서 AI라는 도구를 통해 미래를 준비하는 개인 및 조직을 위한 청사진을 제시합니다.
- 사용자는 원하는 것을 ‘사람의 말’로 커서 AI에게 설명할 수 있습니다.
Keyword
#커서AI #인공지능 #자동화 #코딩 #생산성향상 #비전공자 #미래기술 #혁신적도구 #코드자동생성
Author
서승완: 20대 MIT 출신 개발자. 커서 AI 관련 저술 활동.
1. Befor Qustion
2. Synopsis (개요)
2.1 저자 - 서승완
유메타랩(Yumeta lab) 대표이자 세종사이버대학교 인공지능학과 겸임교수, AI3 프롬프트 리서치랩의 디렉터이다. 국내 1세대 프롬프트 엔지니어로서, ‘프롬프트 엔지니어 코리아(PPEKR)’를 설립하여 국내 프롬프트 생태계의 확장과 표준화를 위해 노력하고 있다. AI 작문 서비스 토씨 (TOSSII)와 프롬프트 공유 플랫폼 지피테이블(GPTable)을 개발했으며, 삼성전자·LG전자·SK·라인 등 다양한 기업 및 기관에서 교육 및 컨설팅을 진행하고 있다. 유년시절부터 코딩을 공부해 한국정보올림피아드(KOI)에 입상하는 등 IT 분야에서 활약했고, 대학에서는 철학을 전공하며 기술과 인문학의 융합을 위한 이론적 토대를 쌓았다. 석사과정 중 전국 최초로 구축한 메타버스 캠퍼스인 YUMC는 영국 BBC, 홍콩경제일보 등 해외 언론의 큰 주목을 받았다. 주요 저서로는 경제경영 베스트셀러 『챗봇 2025』(트렌드&활용백과) 외에, 『프롬프트 엔지니어링 교과서』, 『챗GPT가 쏘아올린 신직업 프롬프트 엔지니어』 등이 있다.
2.2 주제
2.3 기획 및 지필 의도
2.4 주요 등장 인물
2.5 전체 줄거리
3. After My Idea
3.1 Insight
3.2 After Qustion
-
(why) 이 책의 제목을 이렇게 지은 이유는?
-
(how) 어떻게 설명하고 있는가? 어떻게 하라고 하는가? 어떻게 해야하는가?
-
(where) 어느 곳에서 쓴 책인가? 어느 것을 위해 쓴건인가? 어디로 가야하는가? 어디에서 읽어야 하나? 그곳은 어떤 곳인가?
-
(when) 이책은 언제 쓰여졌는가? 시대적 배경은 무엇인가? 언제를 기준으로 쓰였는가? 언제 할것인가?
-
(who) 저자는 누구인가? 주인공은 누구이고 어떤 사람들이 나오나? 누구를 위해 저자는 말하는가?
-
(why) 이책을 통한 질문을 만들기
- 질문 1.
- 질문 2.
-
(what) 이 책에서 말하는 주제라는 무엇?
- 알게된 것은 무엇인가?
- 해야할건 먼가?
- 다른 책과 다른 점은 먼가?
- 이 책의 특징은 먼가?
3.3 Top 3 Highlight
4. Key Word 책에서 뽑은 키워드 정리
4.1 키워드 1
키워드-제목 1
5.책 밑줄 정리 (책 밑줄 전체,page)
6.읽으면서 떠오른 생각들
CSS 프레임워크
웹페이지의 디자인과 레이아웃을 더 쉽고 빠르게 만들 수 있도록 미리 만들어진 스타일 모음집
Tailwind CSS
최근 가장 인기있는 유틸리티 기반 프레임워크
Bootstrap
전통적이고 유명한 프레임워크
아이콘 라이브러리
웹사이트에서 사용할 수 있는 다양한 아이콘 모음
Font Awesome
가장 많은 아이콘을 보유한 라이브러리
Material Icons
구글의 깔끔한 디자인 아이콘(텍스트 치환)
플레이스홀더(더미 데이터)
개발 단계에서 사용할 수 있는 임시 데이터 서비스
Placehold.co
크기별 회색 견본 이미지
Picsum
실제 고품질 랜덤 이미지
DiceBear
여러 스타일의 아바타 아이콘
randomuser.me
실제 인물 사진 랜덤
- 남성: /men/숫자.jpg (1-99)
- 여성: /women/숫자.jpg (1-99)
- 썸네일: /thumb/men/숫자.jpg
- 중간크기: /med/men/숫자.jpg
- 큰크기: /lrg/men/숫자.jpg
용어
AI에게 사이트 영역의 이름을 명확하게 주려면
다음 그림처럼 화면 상단에 있는 메뉴를 내비게이션 바(Navigation Bar)라고 합니다. 줄여서 ‘Navbar’라고도 많이 씁니다. 그다음 위쪽의 큰 영역을 히어로 섹션(Hero Section), 그 다음 영역을 피처스 섹션(Features Section), 어바웃 섹션(About Section), 그리고 쭉 내려가다가 화면 가장 아래에 있는 영역을 푸터(Footer)라고 합니다. 커서에게 웹 디자인을 시킬 때 최소한의 용어는 알아두는 것이 좋습니다. <커서 AI 트렌드&활용백과>, 서승완 - 밀리의 서재
데이터 저장 방식
#웹디비 #web #db #쿠키 #IT
웹사이트 데이터 저장 방식 비교
| 특징 | 쿠키 (Cookie) | 로컬 스토리지 (Local Storage) | 세션 스토리지 (Session Storage) |
| 데이터 저장 위치 | 브라우저 + 서버 전송 가능 | 브라우저 내부 저장소 | 브라우저 내부 저장소 |
| 데이터 유지 기간 | 만료일 설정 가능 (기본적으로 영구 아님) | 삭제하지 않으면 영구 저장 | 브라우저 탭을 닫으면 삭제 |
| 데이터 크기 제한 | 약 4KB | 약 5~10MB | 약 5~10MB |
| 서버와의 통신 | 서버로 자동 전송됨 (HTTP 요청 시 포함) | 서버에 자동 전송되지 않음 | 서버에 자동 전송되지 않음 |
| 보안 수준 | 상대적으로 낮음 (세션 탈취 가능) | 비교적 안전 (Same-origin 정책 적용*) | 비교적 안전 (Same-origin 정책 적용*) |
| 사용 목적 | 로그인 정보 유지, 사용자 설정 저장, 광고 추적 | 장기적인 사용자 설정 저장, 캐싱 데이터 유지 | 현재 세션 동안 임시 데이터 저장 (예: 폼 입력값) |
- Same-origin 정책: 웹 브라우저에서 실행되는 스크립트(자바스크립트 등)는 같은 출처(Same-origin, 도메인+프로토콜+포트 번호)에서만 리소스에 접근하도록 제한하는 것
커서 프롬프트 - 웹 디자인 시의 규칙
Rules 2. 웹 디자인 시의 규칙
- 테일윈드 CSS와 이미지 플레이스홀더 규칙
웹 디자인 시에는 반드시 아래 규칙을 따르세요.
# Tailwind CSS 규칙
- 모든 스타일링은 Tailwind CSS의 유틸리티 클래스를 사용해 주세요.
- 임의의 값 (arbitrary values)은 사용하지 말고, Tailwind의 기본 스케일을 사용해 주세요.
- 레이아웃은
flex나grid를 활용해 주세요. - 반응형 웹 디자인은
sm:,md:,lg:,xl:브레이크포인트를 사용해 주세요.
# 이미지 관련 규칙
- 임시 이미지는 반드시 picsum 또는 placekitten을 사용해 주세요.
- 이미지 크기는
width와height를 명시적으로 지정해 주세요.
# 컴포넌트 예시 만들 때
- 실제 콘텐츠 대신 의미 있는 더미 텍스트를 사용해 주세요.
- 숫자는 실제와 비슷한 범위의 값을 사용해 주세요.