FrontEnd83 [ Next.js ] Static Site Generation vs Server Side Rendering 원문 Static Site Generation (SSG) 란? 서버에 배포하기 전에 빌드하는 단계에서 HTML 페이지를 생성하는 것을 말한다. SSG 장점 페이지 로드 시간이 빠르다. 향상된 Search Ending Optimization (SEO) 서버에서 생성될 필요가 없기 때문에 비용적인 면에서 효율적이다. Next.js 로 SSG 구현하기/실행하기 => getStaticProps 사용하기 빌드 단계에서 반환된 prop로 미리 페이지를 렌더하는 기술을 말한다. 사전에 data fetching 과 page content generation이 진행돼 정적 파일로 보관되어 유저가 request를 하자마자 제공할 수 있다. export default function Home({ data }) { retur.. 2023. 11. 24. [ JavaScript ] 데이터 Map 데이터 구조로 사용하기 이번에 우테코 프리코스 과제를 하면서 데이터 구조에 대해 고민을 하는 기회가 있었다. 그리고 새삼스럽지만 자바스크립트를 쓸 때는 JSON 형식으로 데이터를 관리한다는 걸 의식하게 됐다. 하지만 JSON 형태 말고, Map구조로 이번엔 데이터를 관리하기로 했다. 특별한 이유는 없고, 최근에 Map에 대해 공부하고 있어서 좀 더 활용해보고 싶었다. 이 오류가 어디를 나타내는 건지 정말 한참이나 해맸었던.... ^^ The error message you're encountering indicates that you're trying to destructure a non-iterable object. In JavaScript, objects or values can be iterable, meaning the.. 2023. 11. 15. [ JavaScript ] 배열에서 특정 요소 찾기 find() 배열에서 제공된 테스트 함수를 만족하는 첫 번째 요소를 반환한다. 테스트 함수를 만족시키는 값이 없으면 undefined를 반환한다. const array1 = [5, 12, 8, 130, 44]; const found = array1.find((element) => element > 10); console.log(found); //12 findIndex() 배열에서 찾은 요소의 인덱스가 필요할 때 사용한다. 주어진 판별 함수를 만족하는 배열의 첫 번째 요소에 대한 인덱스를 반환한다. 만족하는 요소가 없으면 -1 반환한다. const array1 = [5, 12, 8, 130, 44]; const isLargeNumber = (element) => element > 13; console.lo.. 2023. 11. 13. [ CSS ] text-wrap 보호되어 있는 글 입니다. 2023. 11. 11. [ JavaScript ] 문자열에서 공백 있는지 확인하기 우테코 프리코스 과제를 진행하고 있다. 그 과정에서 input의 유효성을 검사하는 함수를 만드는데 해당 input이 공백을 포함하고 있는지를 확인하는 걸 만드려고 한다. 제거까지해도 되고. 첫 번째 시도로 trim()을 써서 공백이 있든 없든 그냥 읽단 없애버리면 되지 않을까 생각했는데, trim은 문자열 앞과 끝의 공백만 제거가 가능했다. 공백이 사이에 있으니까 에러가 떴다. 두 번째는, 정규표현식과 includes메서드를 사용해보려고 한다. (includes 는 Array 와 String 둘 다 있다.) 결과가 예상치 못하게 나왔다. 에러 메세지가 정규표현식은 안된다고 하니 그냥 공백을 넣어보자. 'hel lo'.includes(' ') //true 음 잘 나온다. 이렇게 쓰면 될 것 같다. 바로 블.. 2023. 11. 4. 상수 대문자 처리할 때 어떤 기준으로 나눠야할까? (feat. 매직 넘버) 이번에 우아한테크코스 프리코스 과제를 해 나가면서, 요구사항 중에 에어비앤비 스타일 가이드를 따르라는 사항이 있어서 그에 맞게 하려고 하는 중이다. 근데, 코드리뷰를 받고 하면서 뭔가 관점에 따라 구분하는 기준이 다른 것 같아서 어떻게 해야할 지 고민이 되었다. 의문이었던 부분이 바로 여기인데, 상수를 대문자화하는 경우에 대해서 말하고 있다. (1) export 되는 경우 (2) `const`로 선언된 경우(재할당이 불가능하다) (3) 프로그래머가 그 값이(중첩된 속성까지도) 절대 바뀔 일 없다고 확신하는 경우 그리고 가능한 의문들에 대해서도 답을 하고 있다. Q) 모든 `const` 를 다 대문자화 해야할까？ A) 불필요하다. export 되는 애들을 하면 된다. Q) export 되는 객체들은 어떻게.. 2023. 11. 4. 이전 1 2 3 4 5 6 7 8 ··· 14 다음
