전체 글99 SSR, CSR, SSG, ISR 특징 및 Next.js 적용 방법 목차1. SSR (Server-Side Rendering)2. CSR (Client-Side Rendering)3. SSG (Static Site Generation)4. ISR(Incremental Static Regeneration)5. Next.js의 적용 방법 SSR, CSR, SSG, ISR은 웹 애플리케이션에서 페이지를 렌더링 하고 사용자에게 콘텐츠를 전달하는 다양한 방법을 설명하는 개념이다.각 방식들은 데이터 로딩 및 렌더링 타이밍에 따라 웹 애플리케이션의 성능과 사용자 경험에 큰 영향을 미친다. 1. SSR (Server-Side Rendering)SSR은 서버 사이드 렌더링을 의미한다.사용자가 페이지를 요청하면, 서버가 요청된 페이지의 HTML을 생성하고, 완성된 HTML을 클라이언트에게.. 2024. 8. 7. 00:38 방통대 컴퓨터과학과 졸업 드디어 나도 학사 졸업장을 받게 되었다. 2020년도 2월부터 시작해 지금까지 쉬지 않고 4년 동안 달려온 결과가 드디어 나왔다. 직장생활을 하면서 병행하긴 쉽지는 않았지만 졸업장을 받으니 무척 보람이 있다. 거기다 4학년때는 이직하여, 잦은 야근에 주말출근이였는데 다행히(?) 무탈하게 졸업하였다.. 원래는 정보처리기사 자격증을 취득해야 졸업할 수 있는 요건이 되었는데 2023년도에 폐지되었고, 이수 학점이 130점만 넘으면 자동으로 졸업하는 형태로 바뀌었다. 근데 나는 정보처리기사도 따고 졸업도 하였으니 두마리 토끼를 다잡은 거 같다! 다행히도 내가 일하는 직무랑 겹치는 것이 많아서 다른사람들보다 공부하기 수월하기도 했고, 내가 궁금했던 과목들을 수강할 수 있어서 은근 재미도 있었다. 학력 및 부족한 .. 2024. 3. 15. 23:38 [정보처리기사] 2023 정기 2회 정보 처리 기사 실기 합격 2023 정기 2회 정보처리기사 실기 합격 드디어 내가 개발자로 들어오면서 목표한 시험을 합격하였다. 비전공자로써, 4년제 대학도 같이 병행하면서 정보처리 기사는 꼭 따야겠다하는 생각으로 회사생활과 학교생활을 병행하였는데, 학교 졸업요건에도 정보처리기사가 있어서 준비하게 되었다. 2020년 이후로 난이도가 급격히 올라서 필기는 걱정을 사실 많이는 안했었지만, 공부할 시간이 모자라서 걱정되었는데 다행히도 한번에 합격하였고, 실기도 상당히 시간이 모자라는 상황에서 기출을 많이 못돌리고 시험을 보았다. 하지만 주어진 시간내에서 새벽까지 열심히 한 결과가 다행히 좋게 나왔다! 그리고 합격자 발표와 동시에 합격률을 보니 17.9%라는 낮은 합격률이 나와서 더욱 다행이였다.. 이제 졸업도 할 수 있으니 마음 편하게.. 2023. 9. 3. 20:06 Vue.js 공식 문서 개념 공부 Vue.js? 1. Vue.js 개요 사용자 인터페이스를 구축하기 위한 JavaScript 프레임워크, 표준 HTML, CSS, JavaScript 기반으로 구축, 사용자 인터페이스를 효율적으로 제공하는 컴포넌트 기반 프로그래밍 모델을 제공함 2. Vue.js 예제 import { createApp, ref } from 'vue' createApp({ setup() { return { count: ref(0) } } }).mount('#app') 숫자 세기: {{ count }} 선언적 렌더링(Declarative Rendering) : Vue는 표준 HTML을 템플릿 문법으로 확장하여 JavaScript 상태(State)를 기반으로 화면에 출력될 HTML을 선언적(declaratively)으로 작성할 .. 2023. 8. 24. 23:41 [정보처리기사] 2023 정기 2회 정보처리기사 필기 합격 [2023 정보처리기사 필기 합격 후기] 정보처리기사 필기시험을 봤다. 다들 필기는 쉽다고 하지만, 공부하기 어려운 여건에서 합격하여서 더 뿌듯한 거 같다. 직장에선 앱 론칭을 위해 밤새 2~3주간 철야작업을 지속하고, 각종 경사, 조사가 겹쳐져서 공부할 여력조차 나지 않았다. 시험 보기 이틀 전에 전체범위를 한 바퀴 돌리고, 기출문제 또한 2회분 정도 풀고 갔다. 나는 촉박한 걸 싫어하지만, 시간이 없으니 장례식장에서 새벽 6시까지 공부하였고, 회사 퇴근시간 이 되면, 10시까지 회사에서 공부를 하였다. 회사에서 공부하면 일도 시키지만.. 책은 시나공으로 공부했다. 작년에 정보처리산업기사를 취득한 것이 큰 도움이 되었다. 공부법 시간이 많을 때는 기출문제 풀이 일주일 정도로 꼭 남겨두길 바란다. 생각보.. 2023. 5. 22. 15:37 [React] useDeferredValue 이전 관련 글 2023.03.23 - [개발/React] - [React] lodash를 활용한 debounce 2023.03.26 - [개발/React] - [React] useTransition 알아보기 useDeferredValue useDeferredValue도 useTransition과 마찬가지로 React 18에 들어와서 새로 도입된 HOOK이다. 사용방법 const deferredValue = useDeferredValue(value); useDeferredValue에 값이 들어오게 되면, 렌더링 우선순위에 따라 값을 반환하게 된다. useTransition은 setState와 같은 함수의 우선순위라면, useDeferredValue는 값의 우선순위에 따라 값을 지연하게 된다. 이는 api호.. 2023. 3. 28. 00:22 [React] useTransition 알아보기 useTreansition hook api useTransition은 React 18에 들어오면서 새로 도입된 함수이다. 바로 공식문서의 예제를 보면서 정리하겠다. function App() { const [isPending, startTransition] = useTransition(); const [count, setCount] = useState(0); function handleClick() { startTransition(() => { setCount(c => c + 1); }); } return ( {isPending && } {count} ); } useTreansition 함수의 반환값은 isPending , startTransition 으로 설정된다. isPending은 현재 작업이 지연.. 2023. 3. 26. 23:18 [IntelliJ] 프로젝트 properties 파일 유니코드 한글 변환법 인텔리제이를 처음 사용하면서, 사용방법이나 환경설정에 대해 간단하게 정리해보려 한다. 인텔리제이를 설치하고, .properties파일의 한글이 유니코드로 보이는 경우에 환경설정에 대해 정리한다. 보통 메세지를 프로퍼티 파일로 정리해 놓는데 이 파일이 유니코드로 변환되어 저장된다. [/resource/messages/해당 properties]파일이 경로에 존재한다. properties에는 다음과같이 유니코드 형태로 나온다 해결 방법 1. inteliJ 상단에 환경설정 아이콘을 누른다. 2.preferences를 클릭한다. 3. preferences 에서 File Encodings를 클릭하고 - Global Encoding : UTF-8 - Project Encoding : UTF-8 - 하단 Transpa.. 2023. 3. 24. 10:48 [React] lodash를 활용한 debounce lodash를 활용한 debounce 이전 포스팅에서 디바운스와 쓰로틀링에 대해 정리하였다. Javascript를 사용할 때 아주 유용한 라이브러리 lodash란 라이브러리가 있다 이 라이브러리를 이용하면, debounce 이외에도 자바스크립트에서 지원하지 않는 편한 함수들을 지원해 준다. 공식 사이트는 아래와 같다. https://lodash.com/ Lodash _.defaults({ 'a': 1 }, { 'a': 3, 'b': 2 });_.partition([1, 2, 3, 4], n => n % 2);DownloadLodash is released under the MIT license & supports modern environments. Review the build differences &.. 2023. 3. 23. 00:21 이전 1 2 3 4 ··· 11 다음 728x90
