전체 글

4월이 끝났다. 늘어짐과 마감의 연속으로 정신없었던 하루들이 지나갔다. 지나감을 곱씹기 위해 무엇을 했고, 어떻게 발전했는지 적어보는 회고글. 주차별 계획 4월 달부터 노션에 주차별로 계획표를 세우기 시작했다. 주차별로 달성률을 확인할 수 있다는 장점이 있지만, 강제성이 없어 지키지 못한 계획도 많다. 글또 2개 발행 예전엔 주제 선정에 굉장한 스트레스를 느꼈는데, 솝트 생각 과제 덕분에 주제를 잡기가 쉽다. 또 과제를 할 때나 스터디를 하면서 좀 더 공부해보고 싶다는 생각이 드는데, 앞으로도 글또 주제는 고민이 덜 할 것 같다. 어쨌든 아직까지 보증금은 사수하고 있다는 것. 하지만 퀄리티를 어떻게 높일지는 미지수이다. 아무래도 처음 계획은 글또만을 생각하고 너무 과하게 짠 감도 있다. (사실은 이것저것..

React 프로젝트의 폴더구조는 어떻게 설계하는것이 좋을까? 🔥 목차 🔥 1. 리액트 폴더 구성에 대해 2. 폴더 구성 시 알아두면 좋은 것들 - presentational / container component / Atomic Design 3. 리액트가 추천하는 프로젝트 구조 설계 방법 - 파일 유형 / 기능 및 라우터 별로 분리하는 법 4. 참고 자료 및 더 읽어보면 좋을 것들 1. 리액트 폴더 구성에 대해 리액트 아키텍쳐의 특성 리액트는 Javascript 라이브러리로서, UI 컴포넌트를 설계할 수 있는 UI 라이브러리이다. Vue와 같은 다른 프레임워크와 다르게 복잡한 구성에 있어 패턴에 제약이 없는 게 특징이다. 하지만 최소한의 변경으로 재사용되고, 반복적인 코드를 통해 가독성을 높이기 위해서는..

1. 객체와 프로퍼티란? - 하나의 데이터만 담을 수 있는 원시형 타입이 아닌 다양한 유형의 데이터를 담을 수 있다. 1) 객체를 만드는 법 - 객체 생성자 let user = new Object(); // '객체 생성자' 문법 - 객체 리터럴 let user = {}; // '객체 리터럴' 문법 2) 프로퍼티 - 키 값으로 이루어져 있고, 객체이름.객체프로퍼티 로 객체의 값을 얻을 수 있음 - delete로 프로퍼티 삭제 가능 let user = { // 객체 name: "John", // 키: "name", 값: "John" age: 30 // 키: "age", 값: 30 }; // 프로퍼티 값 얻기 alert( user.name ); // John // 프로퍼티 값 삭제 delete user.age..

저번 소마에 이어 두번째 코테를 보게 되었다. 불합격에 가까운 느낌에 미리 써보는 후기.. 나는 삼성SDS의 소프트웨어직 대학생 인턴에 지원을 했다. 0) 코테 일정은 언제 나오는가? 상반기 접수기간은 3월 15일이 마감일이었다. 그리고 서류 발표는 4월 3일 6-7시쯤 나왔다. 두둥 - 그런데 결과 나오자마자 6일 뒤가 코테였다. 😤 뭐 해야지.. 1) 코테를 어떻게 준비했는가? - 백준 기출문제집 무작정 풀기 그리고 일주일에 4개 정도 실버2-골드3 수준의 문제로 풀었다. 또 백준의 삼성SW역량테스트 기출문제에서 골라서 주로 풀었다. 한 문제에 2-3시간씩 걸려서 해명을 하자면, 한 문제 풀다가 막히면 다음 날에 풀고, 이런 식으로 진행되어서 늘어진 것 같다. 여기서 깨달은 점은 너무 많은 시간이 든..

[2.16] 함수선언문 VS 함수표현식 / 콜백함수 1) 함수 표현식 function ET() { alert( "E-T" ); } - 이때 아래와 같이 ET함수를 ET()가 아닌 ET를 통해, 변수에 함수를 전달할 수 있다. function ET() { alert( "E-T" ); } let func=ET func(); //E-T ET(); //E-T 2) 함수 선언문 let ET = function() { alert( "E-T" ); }; - 함수에 변수를 할당한 것. - 이때는 변수를 선언한 것과 마찬 가지임으로 블록 다음에 세미콜론을 붙여줘야함. 3) 함수표현식 VS 함수선언문 함수 표현식 함수 선언문 표현식 안에 존재. 주로 할당 연산자 (=)와 함께 독자적인 구문 형태 실행 흐름이 해당 함수 부..

[2.10] IF문 / 삼항연산자 1. 기본구조 - js에서의 if문도 다른 언어와 비슷하게 조건 + 조건 만족 시 수행할 블록 의 구조를 이룬다. - 조건을 판단하기 위한 변수를 prompt로 넘겨줄 수 있다. - 또한 if + else if + else 조합을 사용할 수 있다. let year=prompt('이티의 나이는?',''); if (year35){ alert('그 정도로 많진 않습니다.'); } else{ alert('네 24짤입니다.'); } 2. 삼항 연산자 - 위와 같은 구문은 조건부 연산자로 간결하게 표현 가능하다. - 삼항 연산자라고 불리는 이유 : 피연산자를 3개 가지기 때문이다. (조건) ? 참일 때 값 : 거짓일 때 값 age=24 let question = age>25? tr..

1. 웹 최적화는 무엇일까? 웹 최적화란? 크게 프론트엔드 단에서 최적화를 할 때 렌더링을 최적화하는 방법과, 로딩을 최적화하는 방법이 있다. 이를 통해 리플로우를 최대한 적게 발생시키고, 화면을 빨리 그리는 것이 목표라고 할 수 있다. 콘텐츠를 브라우저 단에서 최고의 조건에서 다룸으로써 최대한 빨리 클라이언트에게 ui/ux를 제공할 수 있도록 웹 성능을 고도화하는 것을 말한다. 리플로우란? 브라우저는 아래와 같은 순서로 그려지는데, 레이아웃에 영향을 주는 css 속성을 변경할 경우 다시 레이아웃이 그려지는 것을 리플로우라고한다. 또한 레이아웃이 아닌 다른 속성을 건드리는 경우는 리페인트라고 한다. 프론트엔드 단에서 최적화하는 방법 외에도 백엔드 단에서 최대한 빠르게 사용자에게 닫기까지 조정할 수 있는 ..

0. 목차 1. 물리세계 2. 어떤 라이브러리를 쓸 것인가? 2D vs 3D 3. 물리 라이브러리 종류 4. 물체를 물리 세계에 놓아보자 CANNON 5. 공과 바닥이 부딪혔을 때, 공이 튀지 않을까? Material 6. 공은 사실 데구르르 구른다 applyLocalForce 1. 물리세계 three.js의 mesh가 생성될 때 물리세계에서도 mesh가 생성된다. 프레임마다 렌더링 전에 물리세계에서도 업데이트가 이루어지기 때문에, 물리 세계의 좌표가 먼저 지정된 후에, three.js의 mesh에 그 좌표가 적용되는 식으로 진행된다. 물리세계와 threejs의 mesh세계를 별도로 생각하면 이해하기 쉽다. 2. 어떤 라이브러리를 쓸 것인가? 2D vs 3D 3d의 물리법칙을 2d로 축약할 수 있다면 2..