fullstack-study

https://www.hll.kr/ 에이치엘엘 중앙 | HLL중앙HLL중앙은 매거진 미디어에서, 디지털 콘텐트 마케팅, 취향 커머스 사업과 엔터테인먼트까지, 트렌드의 최전방 영역에서 활발하게 사업을 진행하고 있습니다. 에이치엘엘중앙과 허스트중앙은www.hll.kr        style.css html  결과

AWS 배포  1. EC2 인스턴스 생성AWS 콘솔에서 EC2 서비스로 이동합니다."인스턴스 시작"을 클릭합니다.Amazon Linux 2 AMI 또는 Ubuntu Server를 선택합니다.인스턴스 유형 선택 (t2.micro가 프리 티어로 이용 가능).필요한 보안 그룹 설정:SSH (22 포트)HTTP (80 포트)HTTPS (443 포트)애플리케이션 포트 (예: 3000, 5000)새 키 페어를 생성하고 다운로드합니다.인스턴스를 시작합니다.  1. 인스턴스 시작  AWS 배포  2.  이름, Quick Start 설정   3. 키페어 생성   4.키 페어 파일은 로컬에서 EC2 인스턴스에 접속할 때 사용 되는 키리액트 프로젝트의 root로 이동  5. VPC 없으면 기본생성     인스턴스 시작

이미지 보정   # 이미지 크기 조절하는 법1) [메뉴바] Image -> Image Size2) Resample 체크를 누르고, 단위를 Pexels로 변경한다.3) Width를 700이나 1500등, 변경한다. (이때 가로 세로 비율이 유지되도록 옆에 사슬 같은 연결고리를 활성화한다.)4) Resolution을 96, 72, 300 등 이미지를 사용하는 적합한 환경인 해상도를 입력한다. # 동물의 털 선명하게 표현하는 법1) 호랑이 사진을 포토샵으로 불러온다.2) [메뉴바] Image -> Auto Tone / Auto Color / Auto Contrast 순으로 보정한다.3) 보정한 호랑이 레이어를 복제한다. (단축키 Ctrl + J)4) 3번에서 복제한 레이어를 선택한 후 [메뉴바] Image -..

카카오 로그인  https://developers.kakao.com/ Kakao Developers카카오 API를 활용하여 다양한 어플리케이션을 개발해보세요. 카카오 로그인, 메시지 보내기, 친구 API, 인공지능 API 등을 제공합니다.developers.kakao.com  1. 카카오 로그인 > 문서보  2. 내 애플리케이션 > 애플리케이션 추가   3. 앱키 4. 플랫폼 > web 플랫폼 등록    5.    6. : .envVITE_KAKAO_JAVASCRIPT_KEY=????VITE_KAKAO_REST_API_KEY=????VITE_KAKAO_REDIRECT_URI=https://xxx.vercel.app/oauth/ 7. config.jsconst isLocal = window.location..

TMDB API  1. 가입https://www.themoviedb.org/?language=ko The Movie Database (TMDB)찾으시는 영화나 TV 프로그램이 없나요? 로그인 하셔서 직접 만들어주세요.www.themoviedb.org  2. More > API  또는  프로필 > 설정 > API   3.  API  >  생성 > Developer  4. 사용약관 스크롤  맨아래 동의   5.  작성   6. API 페이지 이동 ( API, 액세스토큰  사용 )  7.  More > API    8.  API Reference    9. Movie List > Now Playing > Try it > JSON 생성   10.  11.  이미지 기본 경로 https://developer.th..

vercel 배포  vercel이란?Vercel은 프론트엔드 개발자를 위한 클라우드 플랫폼으로, 빠르고 간편하게 웹 애플리케이션을 배포할 수 있도록 도와주는 서비스입니다. Next.js의 개발사이기도 하며, Next.js를 최적화하여 지원하지만, React, Vue, Svelte, Angular 등 다양한 프레임워크를 사용할 수 있습니다.  Vercel 공식 사이트 공식 사이트에서 GitHub, GitLab, Bitbucket 계정으로 가입 vs 터미널에서  1.  npm run build 또는 yarn build 2. vercel login >> 로그인 선택   >> 이 메일로 로그인했을경우 이메일 확인 >> 이메일 > 코드 인증  이메일 인증 완료후   3. vercel 입력  ? Set up and..

Grid  mdm바로가기      1. Container 속성Grid 컨테이너는 부모 요소에 적용되며, 그 내부의 레이아웃을 정의합니다.속성설명displayGrid 레이아웃 활성화 (grid 또는 inline-grid 설정).grid-template-columns열의 크기와 개수를 정의.grid-template-rows행의 크기와 개수를 정의.grid-template-areasGrid의 영역 이름을 정의.grid-templategrid-template-rows, grid-template-columns, grid-template-areas를 한 번에 설정.gap (또는 grid-gap)열과 행 간의 간격 설정.row-gap행 간의 간격 설정.column-gap열 간의 간격 설정.justify-items모든..

베리어블 프로토타입  # number      # String

nextjs 배포  배포 테스트 https://92dfba48.aaa-9su.pages.dev/ Create Next App 92dfba48.aaa-9su.pages.dev   1. 프로젝트 생성 npx create-next-app@latest  2. 깃 저장소 만들기 ( 테스트용 ) 3. 프로젝트 생성 저장소 올리기  4. cloudflare 가입 https://www.cloudflare.com/ko-kr/ 모든 곳을 연결하고, 보호하며, 구축합니다복잡성과 비용을 줄이면서 직원, 애플리케이션, 네트워크를 어디에서든 더 빠르고 안전하게 만듭니다.www.cloudflare.com  3. Workers 및 Pages  3. Pages  git 연결   4. 계정에서 사이트 배포  5.   6. 발드 설정 및..

기본 타입  1. unknown모든 타입의 슈퍼 타입으로, 모든 값이 할당될 수 있습니다.타입이 명확하지 않을 때 사용하지만, any와 달리 제한적입니다. 사용하기 전 명확한 타입으로 좁히는 타입 가드가 필요합니다. 2. any모든 타입을 허용하는 타입으로, 타입 검사를 건너뛰는 역할을 합니다.타입 안정성을 낮출 수 있으므로 가능한 사용을 자제하는 것이 좋습니다. 3. 기본 타입들null: null 값만 가질 수 있는 타입입니다.void: 함수가 값을 반환하지 않을 때 주로 사용되는 타입입니다.number: 숫자 타입이며, Number Enum을 포함합니다.bigint: 큰 정수를 표현하는 타입으로, 일반 숫자보다 큰 정수를 다룰 때 사용됩니다.boolean: true 또는 false의 불리언 값을 가지..