전체 글

참고사이트* 카카오 FE 기술 블로그 아토믹 디자인을 활용한 디자인 시스템 도입기 | 카카오엔터테인먼트 FE 기술블로그정호일(harry) 카카오페이지에서 웹 프론트엔드를 개발하고 있습니다. 집보다 밖에 돌아다니는 걸 좋아합니다.fe-developers.kakaoent.com해당 페이지의 내용을 담고 있으며, 머릿속에 담기 위해 적어가면서 공부 (끄적.. 끄적..)  🧩 컴포넌트의 파편화비슷한 모양 및 기능을 컴포넌트가 여러 개 있다고 생각해보자.이걸 각기 하나 하나 다 만들어내는 것에 대해서는 구현하면 컴포넌트 파편화라는 제 각각의 컴포넌트가 발생한다.그럼 유지보수 할 때, 각각의 파편화된 컴포넌트를 찾아서 고쳐야하는 문제점이 발생한다. ❓ 왜 쓰는건데?디자인 시스템내에서 수 많은 수정 작업들이 일어난..

사이트https://www.acmicpc.net/problem/1157 단어 공부📄 문제알파벳 대소문자로 된 단어가 주어지면, 이 단어에서 가장 많이 사용된 알파벳이 무엇인지 알아내는 프로그램을 작성하시오. 단, 대문자와 소문자를 구분하지 않는다. ⌨️ 입력첫째 줄에 알파벳 대소문자로 이루어진 단어가 주어진다. 주어지는 단어의 길이는 1,000,000을 넘지 않는다. 🖥️ 출력첫째 줄에 이 단어에서 가장 많이 사용된 알파벳을 대문자로 출력한다. 단, 가장 많이 사용된 알파벳이 여러 개 존재하는 경우에는 ?를 출력한다. 📚 예제 입력1.Mississipi 2.zZa 3.z 📚 예제 출력1.? 2.Z 3.Z  🤔 해결책1. 알파벳은 각각 아스키코드 값을 가진다.2. 알파벳 개수 27개의 배열을 만들..

사이트https://www.acmicpc.net/problem/1152 단어의 개수📄 문제영어 대소문자와 공백으로 이루어진 문자열이 주어진다. 이 문자열에는 몇 개의 단어가 있을까? 이를 구하는 프로그램을 작성하시오. 단, 한 단어가 여러 번 등장하면 등장한 횟수만큼 모두 세어야 한다. ⌨️ 입력첫 줄에 영어 대소문자와 공백으로 이루어진 문자열이 주어진다. 이 문자열의 길이는 1,000,000을 넘지 않는다. 단어는 공백 한 개로 구분되며, 공백이 연속해서 나오는 경우는 없다. 또한 문자열은 공백으로 시작하거나 끝날 수 있다. 🖥️ 출력첫째 줄에 단어의 개수를 출력한다. 📚 예제 입력띄어쓰기를 확인할 수 없으므로 ' '를 '^'로 대체.1.The^Curious^Case^of^Benjamin^Butt..

사이트https://www.acmicpc.net/problem/1008 참고 사이트https://st-lab.tistory.com/212 [백준] 1008번 : A/B - [C++]www.acmicpc.net/problem/1008 1008번: A/B 두 정수 A와 B를 입력받은 다음, A/B를 출력하는 프로그램을 작성하시오. www.acmicpc.net 문제 알고리즘 [접근 방법] 이 문제는 '부동 소수점'에 대한 이해를 필요로 하st-lab.tistory.com작성자가 한창 Java로 알고리즘을 공부할 때 많이 보던 분의 사이트인데... C++ 까지 있다... 🫢  A/B📄 문제두 정수 A와 B를 입력받은 다음, A/B를 출력하는 프로그램을 작성하시오. ⌨️ 입력첫째 줄에 A와 B가 주어진다. (..

사이트https://www.acmicpc.net/problem/1001  A-B 📄 문제두 정수 A와 B를 입력받은 다음, A-B를 출력하는 프로그램을 작성하시오. ⌨️ 입력첫째 줄에 A와 B가 주어진다. (0  🖥️ 출력첫째 줄에 A-B를 출력한다. 📚 예제 입력3 2 📚 예제 출력1 🤔 해결책1. 변수 A와 B를 선언한다.2. A와 B를 입력 받아 각각 값을 담는다.3. A와 B를 뺀 값을 출력한다. 🧑🏻‍💻 코드#include using namespace std;int main(void) { int A, B; cin >> A >> B; cout

사이트https://www.acmicpc.net/problem/1000  A+B 📄 문제두 정수 A와 B를 입력받은 다음, A+B를 출력하는 프로그램을 작성하시오. ⌨️ 입력첫째 줄에 A와 B가 주어진다. (0  🖥️ 출력첫째 줄에 A+B를 출력한다. 📚 예제 입력1 2📚 예제 출력3 🤔 해결책1. 변수 A와 B를 선언한다.2. A와 B를 입력 받아 각각 값을 담는다.3. A와 B를 더한 값을 출력한다. 🧑🏻‍💻 코드#include using namespace std;int main(void) { int A, B; cin >> A >> B; cout

🕹️ TransformControls해당 컴포넌트는 mode의 속성을 통해 오브젝트의 편집 모드를 변경할 수 있다. ∙ translate: 오브젝트의 위치 좌표값을 변경∙ rotate: 오브젝트의 회전값을 변경∙ scale: 오브젝트의 규모 변경 따라서 버튼을 생성하고, 해당 버튼을 누를 때 버튼에 적용된 값으로 상태값을 변경하여 컨트롤러의 편집 모드를 설정해보겠다. 이전 게시글에서 mode라는 useState()를 생성하여 "translate" 값을 넣었다. 해당 상태를 만들기 위해 버튼을 만들어보자 📁 Editor / 📄 TransformControlButtons.tsximport { FontAwesomeIcon } from "@fortawesome/react-fontawesome";import..

이전 게시글에서 3D 공간인 Scene을 만들었다. 이제 해당 공간에 박스를 생성해보자. 우선 3D 객체의 구성을 알아보자.3D 객체는 다음과 같이 이루어져있다. 이하, 3D 객체를 모델로 표현하겠다. 🍕 Model∙ 📦 MeshMesh란, 객체를 생성하기 위해서 여러 폴리곤(다각형)의 집합을 이루고 있다.점들이 무수히 모여 선이 되고, 그 선이 모여 폴리곤을 이루고, 해당 폴리곤들이 모여 Mesh라는 객체를 이룬다. ∙ 🌏 Geometry공간의 속성과 관련한 수학 값들이다. ∙ 👕 Material해당 물질을 이루는 재료를 나타낸다.   이 세 가지가 있으면 모델을 표현할 수 있다.  그럼 이제 모델을 만들어보자. 📦 Box박스를 불러오기 위해 📄 BoxLoader.tsx를 생성해주었다. 나는..