분류 전체보기 썸네일형 리스트형 Three.js 공부하기 3D 큐브 만들기 안녕하세요. 에디터M입니다. 저번시간에 만든 2D 큐브를 3D큐브로 변경하는 작업을 이어 포스팅 해보려고 해요. 이전 포스팅을 못 보신 분들은 참고 부탁드려요. Three.js 공부 하기 : Three.js 알아보기 안녕하세요. 에디터M입니다. 오늘은 어제에 이어서 Three.js 공부하기 Three.js 알아보기 포스팅을 해볼께요. 먼저 Three.js가 무엇인지 알아볼까요? Three.js 란? Three.js는 웹 기반 3D 그래픽을 생성하고 min-webstory.tistory.com Three.js 공부 하기 : Three.js 심화 학습 안녕하세요. 에디터M입니다. 오늘은 어제에 이어서 Three.js 공부하기 3D 큐브 만들기 해볼게요. 혹시 이전 내용을 못 보신 분들은 이전 내용을 보고 오.. 더보기 Three.js 공부 하기 : Three.js 심화 학습 안녕하세요. 에디터M입니다. 오늘은 어제에 이어서 Three.js 공부하기 3D 큐브 만들기 해볼게요. 혹시 이전 내용을 못 보신 분들은 이전 내용을 보고 오시는 걸 추천드려요. 2023.07.12 - [공부일지/Frontend] - Three.js 공부하기 : Three.js 알아보기 Three.js 공부 하기 : Three.js 알아보기 안녕하세요. 에디터M입니다. 오늘은 어제에 이어서 Three.js 공부하기 Three.js 알아보기 포스팅을 해볼께요. 먼저 Three.js가 무엇인지 알아볼까요? Three.js 란? Three.js는 웹 기반 3D 그래픽을 생성하고 min-webstory.tistory.com 2023.07.11 - [공부일지/Frontend] - Three.js 공부 하기 : W.. 더보기 Three.js 공부 하기 : Three.js 알아보기 안녕하세요. 에디터M입니다. 오늘은 어제에 이어서 Three.js 공부하기 Three.js 알아보기 포스팅을 해볼께요. 먼저 Three.js가 무엇인지 알아볼까요? Three.js 란? Three.js는 웹 기반 3D 그래픽을 생성하고 렌더링하기 위한 JavaScript 라이브러리입니다. 이 라이브러리는 WebGL을 기반으로 작동하며, 웹 브라우저에서 3D 그래픽을 만들고 보여주는 것을 쉽게 할 수 있습니다. Three.js는 3D 모델링, 애니메이션, 조명, 재질 등 다양한 기능을 제공합니다. 이를 통해 사용자는 웹 페이지에 실시간 3D 시각화를 구현하고, 상호작용성을 높이고, 3D 콘텐츠를 사용자에게 전달할 수 있습니다 . Three.js는 여러 가지 요소를 사용하여 3D 공간을 구성합니다. 씬(Sc.. 더보기 Three.js 공부 하기 : WebGL 알아보기 안녕하세요. 오랜만에 돌아온 에디터M 입니다. 최근에 Three.js에 관심이 생겨서 검색해보고 개인적인 일들이 있어서 몇주 동안 블로그를 포스팅 하지 못했네요. 요즘 장마라서 기분도 별로 좋지 않더라고요. 전 비가 오면 밖에 나가기도 싫어서... 개인적인 이야기는 여기 까지 하고 오늘은 Three.js의 기본 뼈대인 WebGL에 대해 알아 볼게요. 저도 지금 혼자서 공부하고 있는 수준이라 실수 하는 부분도 있는데 잘못 된 부분 댓글로 부탁드려요. WebGL 이란?? WebGL은 웹 브라우저에서 2D 및 3D 그래픽을 렌더링하기 위한 JavaScript API입니다. WebGL은 WebGL 1.0과 WebGL 2.0 두 가지 버전이 있으며, 모두 웹 브라우저에서 하드웨어 가속 그래픽을 사용하여 고품질의 .. 더보기 React Project ) Slack Clone, 이모지, 첨부파일, 채팅입력 안니영~~~ 드디어 Slack Clone 마지막 시간으로 돌아온 에디터 M입니다. 다들 취미가 어떻게 되시나요?? 저는 시간날때 메이플을 하는거 같아요. 그냥 메일 코드만 보다가 아무 생각없이 뇌빼기 사냥을 하면서 머리를 비우는거 같아요. 다들 너무 공부만 하지말고 쉬엄 쉬엄 쉬면서 공부해보세요. 그럼 시작할게요~~ Slack Clone - 이모지, 첨부파일, 채팅입력 저번시간에 보셨는지 모르겠지만 Chat 컴포넌트에 메세지 출력 컴포넌트가 있었는데 const relativeTime = require('dayjs/plugin/relativeTime'); dayjs.extend(relativeTime); function ChatMessage({message, user}) { const IsImages = .. 더보기 React Project ) Slack Clone, 채널, 채팅 안녕하세요. 프론트를 공부하고 있는 비전공자 에디터 M입니다. 저번시간에 이어서 Slcak Clone 코딩 세번째 이야기!! Slack Clone 코딩은 다음이야기가 마지막이 될거 같네요. 아마 해당 프로젝트 리뷰가 끝나면 다음시간부터는 프로젝트가 아닌 Three.js 공부에 관한 블로그 글을 작성 할 것 같아요. 왜냐면 요즘 Three.js쪽에 너무 관심이 많이가네요. 꽤 재밌는거 같아요. 이전편을 못보신 분들은 아래의 링크를 남겨 놓을께요. Slack Clone 1편 2023.06.28 - [공부일지/project] - React Project ) Slack Clone, 회원가입 페이지, 로그인 페이지 만들기, redux React Project ) Slack Clone, 회원가입 페이지, 로그인 페.. 더보기 React Project ) Slack Clone, 메인페이지, Header, 프로필 변경, 로그아웃 작업 안녕하세요. 저번시간에 이어서 Slack Clone 코딩 두번째 이야기!! 프론트 공부하고 있는 비전공자 에디터 M입니다. 저는 원래 퍼블리싱을 하였는데 개발쪽 공부를 하려고 하니 예전에 jsp와 php 배웠을때가 기억이 나네요. 하면 할 수록 이게 맞나 싶고 포기하고 싶기도 한데 그래도 버티고 공부하면 프론트쪽 업무가 편해지는 날이 오겠죠?? 그런데 찾아보니 There.js라고 웹에 그래픽 작업을 할 수 있는게 있더라구요. 그걸 보고 아... 내가 IT쪽으로 온 이유가 생각나더라구요. 디자인을 하며 다양한 효과를 눈으로 보여주며 변화하는게 재밌고 신기해서 했다는걸 굳이 React나 Vue를 배우거나 하지 않고 There.js쪽으로 가도 괜찮겠다. 그러기 위해선 WebGL쪽을 공부해야 되겠더라구요. 원리.. 더보기 React Project ) Slack Clone, 회원가입 페이지, 로그인 페이지 만들기, redux 안녕하세요. 프론트 공부중인 비전공자 에디터 M입니다. 회사 업무와 여려가지 이유로 잠시 블로그에 글을 작성하지 못했는데 포기하지 않고 다시 블로그 글을 작성하러왔습니다. 그럼 제가 블로그를 잠시 하지 않는동안 만들었던 Slack Clone의 코드 리뷰를 해보려고 합니다. 리뷰에 앞서 git주소를 알려드릴께요. 자세한 코드와 package들은 git을 보시면 됩니다. https://github.com/piwe2004/slack-clone GitHub - piwe2004/slack-clone Contribute to piwe2004/slack-clone development by creating an account on GitHub. github.com 그럼 시작해 볼께요. GOGO~~ React Proj.. 더보기 이전 1 2 3 4 ··· 6 다음
