profile
https://www.rarebeef.co.kr/
태그 목록
전체보기 (196)TIL(85)project(71)sql(47)datacamp(33)python(29)dashboard(18)Data Analyst(16)코드스테이츠(12)React(12)블로그(10)Datastudio(9)js(8)data(7)front end(7)query(7)JavaScript(7)CSS(6)nextjs(5)html(5)programmers(5)Cheat Sheet(5)tableau(4)첫 프로젝트(4)office hour(4)유어클래스(3)데이터 분석가(3)analysis(3)redux(3)game(3)JOIN(3)scss(3)typescript(3)league of legends(2)Firebase(2)Visualize(2)steam(2)3D(2)logo(2)블로깅(2)관계형 데이터베이스(2)slide(2)인사이트(2)오피스아워(2)BigQuery(2)pwa(2)ESLint(2)frontend(2)error(2)KPI(2)데이터(2)OfficeHour(2)da(1)타입스크립트(1)next-pwa(1)google sheet(1)webpack(1)벨로그(1)시퀄(1)next(1)baekjoon(1)application(1)Rainbow Six Siege(1)sns(1)react-query(1)데이터베이스(1)State(1)The rare beef(1)예외처리(1)Sass(1)정육면체(1)tailwindCSS(1)게임 배급사(1)RAREBEEF(1)Data Table(1)JS 시계(1)구글docs(1)ngrok(1)시계(1)insight(1)proptypes(1)react native(1)crawl(1)ds(1)Illustrator(1)Crawling(1)Feedback(1)icon(1)next.js(1)next js(1)Database(1)regexp(1)Map(1)columns(1)Data Literacy(1)scrollTo(1)CUBE(1)데이터 분석(1)시간(1)Date(1)OT(1)상태관리(1)Big query(1)kakao(1)vscode(1)netlify(1)self join(1)Data studio(1)date 객체(1)canvas(1)Auth(1)DE(1)scroll-snap(1)JS 시간(1)Relational Database(1)Data scientist(1)web(1)package(1)interactive(1)API(1)npm(1)라이브러리(1)데이터 사이언티스트(1)jupyter notebook(1)settings sync(1)리액트(1)쿼리(1)responsive(1)게임 제작사(1)next/babel(1)nodejs(1)slider(1)데이터 문해력(1)blender(1)데이터 엔지니어(1)리덕스(1)지표(1)FCM(1)데이터 테이블(1)Data Engineer(1)Rainbow Six(1)node.js(1)과제(1)
post-thumbnail

[Blender] 3D 로고 제작

블렌더로 3D 로고 만들기 요즘 Three.js를 공부 중이라 인터넷에서 3D 모델을 구해 여러 기능을 실험하다보니 자연스럽게 3D 모델링에 관심이 가기 시작했다. 직접 만들어보면 재밌을 것 같기도 하고 내 로고를 3D로 만들어두면 두고두고 쓸 데가 많지 않을까 해서 3D로 로고를 제작해보기로 했다. 사용할 툴로 블렌더를 선택한 이유는 일단 무료라는 점, 그리고 프로그램이 가볍다는 점 때문이다. 하다가 막히면 강의를 찾아봐야겠다는 생각으로 무작정 시작했는데 간단한 것을 만드는거라 크게 어려움을 느낀 부분은 없어서 강의까지 찾아 볼 필요는 없었다. Three.js를 공부하다 왔더니 낯이 익은 단어와 기능들도 조금씩 있어서 약간은 도움이 되었던 것 같다. 참고로 이 글을 작성하기 전에 Three.js도 공부한 내용을 게시하려 했었는데 작성 마무리 단계에서 글을 날려먹는 바람에 아마 나중에 다시 작성해서 업로드하게 될 것 같다. 제작 과정 1. 기

2022년 5월 2일
·
0개의 댓글
·
post-thumbnail

[HTML, CSS, JS] 드래그로 회전 가능한 정육면체 만들기

https://codepen.io/RAREBEEF/pen/eYGKZKL JS와 CSS를 사용하여 기존에 만들던 것과는 다른 무언가를 만들어보고 싶었다. 3d로 무언가를 구현해보면 좋겠다는 생각이 들었는데, 처음엔 구체를 만들어볼까 했으나 표면이 꽉 채워진 구체는 현실적으로 구현하기가 어려울 것 같아서 무난하고 전체적으로 균형잡힌 정육면체를 제작해보기 했다. 1. 정육면체 구현 !codepen[RAREBEEF/embed/yLzEOaz?default-tab=html%2Cresult] 정육면체의 구현은 HTML 그리고 CSS 만으로 가능하다. HTML 축과 컨테이너 역할을 할 요소를 만들고 자식으로 정육면체의 각 면이 될 요소 6개를 생성한다. CSS 축과 컨테이너 역할을 할 요소에 transform-style: preserve-3d; 를 부여하여 3d 공간에 위치시킨다. 자식으로 들어있는 각 면들은 하나씩 차근차근 translateX, `trans

2022년 1월 5일
·
3개의 댓글
·