개발 & IT 정보

2024.05.12 - [frontend] - [three.js 기초 #0] 시작하기 & 환경 세팅 [three.js 기초 #0] 시작하기 & 환경 세팅※ 순수 자바스크립코드와 three 라이브러리를 사용한 기초 실습입니다. 유튜버 GIS DEVELOPER 님의 강의(https://youtu.be/vjKuk5Vp93k?si=aoRRPljQ3pKDDJO8 )를 보고 정리한 내용입니다.1. Three.js 란?WebGL 위에 구eunjitech.tistory.com[three.js 기초 #1] Geometry1. Geometry란?Geometry는 메쉬, 선, 점 등의 기하학적 형태를 표현하는 데 사용되는 three 핵심 요소모든 정보 데이터들은 하나로 모여 GPU에 빠르게 전달됨2. Geometry 종류B..

※ 순수 자바스크립코드와 three 라이브러리를 사용한 기초 실습입니다. 유튜버 GIS DEVELOPER 님의 강의(https://youtu.be/vjKuk5Vp93k?si=aoRRPljQ3pKDDJO8 )를 보고 정리한 내용입니다.1. Three.js 란?WebGL 위에 구축된 고수준의 Javascript 라이브러리.3D 그래픽을 쉽게 웹 브라우저에 표시하고, 저수준의 WebGL을 직접 다룰 필요 없이 3D 장면, 모델, 카메라, 애니메이션 등을 구축할 수 있음.WebGLWeb Graphics Library 는 웹 브라우저에서 실시간 2D 및 3D 그래픽을 렌더링하기 위한 저수준의 그래픽 API.OpenGL ES의 웹 기반 버전으로, HTML5의 요소를 활용하여 GPU 가속을 통한 이미지와 애니메이션..

재미있는 AI 사이트가 있어서 가져와봤습니다. 제목 그대로 AI로 웹툰을 생성해 주는 사이트인데요. 기본적인 기능은 모두 무료로 제공하고 있어서 간단한 웹툰 만들기에 좋은 것 같아 알려드리려고 합니다. Comicai Comicai라는 사이트에서 AI 이미지 생성 및 웹툰 만들기 기능을 제공해주고 있습니다. 먼저 아래 사이트에 방문하여 회원가입과 로그인을 해주세요. https://comicai.ai/ Comicai comicai.ai 로그인 후 작성시작 버튼을 누르면 만화정보를 입력하는 폼이 나옵니다. 1. 만화정보 입력 이 단계에서는 '만화 제목'과 '제작자' 그리고 만화를 어떤 스타일로 생성할지에 대한 여러 가지 스타일 형식이 나옵니다. 여기서 선택한 스타일을 참조하여 AI가 이미지를 그려주는 것 같습..

이전 글 보러가기 👉 [React Native #02] Expo 프로젝트 생성 [React Native #02] Expo 프로젝트 생성 현재 날짜 기준(2024.02.23)으로 작성된 글입니다. 버전이 다를 수 있는 점 참고 바랍니다. 이전 글 보러가기 👉 [React Native #01] React Native란 무엇일까 [React Native #01] React Native란 무엇일까 [React Native # jamjamtest.com [React Native #03] ScrollView / FlatList 이번 포스팅에는 핵심 컴포넌트의 기능 몇 가지를 소개해보고자 합니다. 1. ScrollView 스크롤 가능한 속성을 제공하며, 스크롤 영역은 부모 컴포넌트에서 제공합니다. ... //스크롤 ..

현재 날짜 기준(2024.02.23)으로 작성된 글입니다. 버전이 다를 수 있는 점 참고 바랍니다. 이전 글 보러가기 👉 [React Native #01] React Native란 무엇일까 [React Native #01] React Native란 무엇일까 [React Native #01] 기초 React Native란? 네이티브 모바일 앱을 제작하기 위한 React 기능 기반의 오픈 소스 프레임워크 React 구성 요소와 동일한 API 구조를 사용 → React에 대한 사전지식이 있으면 유리하 jamjamtest.com [React Native #02] Expo 프로젝트 생성 1-1. Visual Studio Code 설치 Visual Studio Code는 국내에서 가장 많이 사용되고 있는 무료 코드..

[React Native #01] 기초 React Native란? 네이티브 모바일 앱을 제작하기 위한 React 기능 기반의 오픈 소스 프레임워크 React 구성 요소와 동일한 API 구조를 사용 → React에 대한 사전지식이 있으면 유리하게 사용할 수 있음 React.js + React Native → Real Native Mobile Apps (iOS / Android) UI, 로직이 처리되는 방식 UI 요소(View, Text..): Native에 컴파일됨 로직(javascript 코드): 컴파일되지 않음 React Native 내장 컴포넌트 코드 구성 const App = preops => { return ( Hello world! ); }; 해당 코드는 Native App 코드로 컴파일되어 R..

[AI이미지] 직접 사용해보고 추천하는 AI 이미지 생성 사이트 BEST3 빠르고 쉽게 내가 원하는 이미지를 찾아야 해서 급하게 여러 AI 이미지 생성 툴을 찾던 와중에 몇몇 툴들이 퀄리티가 나름 괜찮고 인위스럽지 않게 나와서 특징과 장단점을 이곳에 정리해보려고 합니다. 1. Adobe Firefly https://firefly.adobe.com/ Adobe Firefly firefly.adobe.com Adobe Firefly는 무료(부분무료) 온라인 AI 아트 및 이미지 생성 툴로, 간단한 텍스트 프롬프트를 활용하여 다채로운 이미지를 만들 수 있습니다. 가장 좋았던 점은 수채화, 유화 등 다양한 스타일의 이미지를 만들 수 있는 AI 페인팅 생성 툴도 제공하여 내가 원하는 이미지의 컨셉을 빠르게 찾을 ..

티스토리 2차 도메인 연결하기 & 애드센스 연동 이번 포스팅에서는 티스토리를 2차 도메인으로 연결하고, 애드센스 신청하는 방법에 대해 알려드리겠습니다. 우선 티스토리 2차 도메인을 연결하기 위해서는 개인 도메인을 1개 이상 가지고 계셔야 합니다. 도메인 등록은 카페24나, 가비아 등의 사이트에서 하실 수 있습니다. 이 과정은 생략하고 티스토리에 2차 도메인 연결하는 방법부터 설명드리겠습니다. 티스토리 2차 도메인 설정 티스토리 관리창에서 아래 블로그 메뉴를 선택합니다. 현재는 도메인 연결이 되어있는 상태라 위의 화면처럼 보이지만, 도메인 설정이 되어있지 않은 경우에 개인 도메인 설정에 url을 작성할 수 있는 폼과 변경사항 저장 버튼을 볼 수 있습니다. 그럼 개인 도메인 설정에서 본인이 가지고 있는 도메..

[MBTI] 고양이 성격 유형 테스트! - CatBTI 미루고 미루다 드디어 완성한 첫 MBTI 테스트 사이트! 디자인부터 배포, 구글 애드센스 연동까지 완성했지만 아직 부족한 게 많아 보이네요. MBTI 와 비슷하게 구현해 본 고양이 성격 유형 테스트 총 12개의 문항과, 16개의 성격 유형의 결과 페이지가 있습니다. 고양이의 행동 패턴을 보며 성격을 유추해 보는 재미로 보는 성격 유형 테스트입니다! 두냥이 집사인 저의 주관적인 해석이 가득 담겨 있으니 재미로만 봐주시면 감사하겠습니다. 메인 페이지에 더 다양한 테스트를 추가할 계획이니 많은 참여 부탁드립니다! (공유도 부탁드립니다 하하하) CatBTI 테스트 하러가기 👉 https://jam.baltemtech.co.kr/catBTI

이전 글 보러 가기 👉 [MBTI 테스트 사이트 만들기 #4] 테스트 로직 만들기 (feat. 울집 고양이) [MBTI 테스트 사이트 만들기 #5] 카카오톡 공유하기 버튼 추가하기(React) 친구에게 테스트 결과를 공유하도록 하기 위해서 카카오 공유 API를 활용하려고 합니다. 우선 카카오톡 콘솔 사이트로 가서 어떤 API가 있는지 확인해 보겠습니다. kakao developers > 문서 https://developers.kakao.com/docs/latest/ko/index Kakao Developers 카카오 API를 활용하여 다양한 어플리케이션을 개발해보세요. 카카오 로그인, 메시지 보내기, 친구 API, 인공지능 API 등을 제공합니다. developers.kakao.com 카카오 API를 ..