Pinned Posts
Next.js에서 Soft, Hard Navigation
Navgation 방식?Soft & Hard Navigation 방식의 간단한 개념설명Hard Navigation 방식과 Soft 방식은 웹에서 페이지를 전환 시에 페이지를 전체 로드하는지,특정 컴포넌트만 재 랜더링 하는지의 차이를 가진 라우팅 방식이다.Hard의 경우는 전통적인 라우팅 방식으로 주소창에 새로운 url을 입력하는 것 처럼서버에서 페이지를 다시 생산하여 사용자에게 제공하는 라우팅 방식으로 페이지에 대한 모든 상태가 초기화되며최신 데이터를 직접 받아오기 때문에 특별한 설정을 하지 않았다면, 항상 신선한 데이터를 제공한다.Soft Nav의 경우는 Client에서 이루어지는 라우팅 방식으로 SPA 형식에서 채용되는 라우팅 방식이다.Ajax의 등장으로 가능해진 방식으로 하나의 세그먼트로 지정된 path에 지정된 컴포넌트를 랜더하게 되며,이때 랜더되는 컴포넌트 내의 비동기 함수를 실행하고 Api 요청 반환된 데이터를 통해 React의 가상DOM이나JS의 DOM 핸들링 통해서 시
JavaScript 값과 참조, 메모리 관점으로 톺아보기
js에서 호이스팅, 컨텍스트 생성 등의 개념을 공부하게 되면 빠지지 않고 등장하는 것이 바로 "메모리" 이다.JS엔진은 메모리를 따라 값을 저장하고 , 참조 하며 이를 통해 현 JS의 모든 기능을 표현하고 있다.사실, JS뿐만이 아닌 기본적으로 모든 컴퓨터의 프로그래밍 언어는 메모리를 기반으로 동작한다라는 점에서도 동일하다.예로 "let tes = 1" 같은 구문이 변수의 선언이 어느 시점에 메모리에 할당되며 JS 기본 참조 개념이 무엇 인 지를 인지한다면더 유용하고 실용적인 로직을 구현할 수 있을 것이다.오늘은 JS 엔진이 어떻게 메모리를 활용하고 값과 참조의 개념이 무엇인지를 글쓴이의 시선으로 정의 해 본다.: JS 변수의 선언변수는 JS에서 가장 기본이 되는 저장소이다.기본적으로 메모리를 할당하여 공간을 마련하게 되며 그 안에 값을 할당하는 것을 변수의 선언이라고 이야기 한다.맞는 이야기지만, 조금 세부적으로 풀이한다면 모든 변수는 JS의 컨텍스트 생성 단계에서 "호이스팅" 에
CMS Blog (1)
CMS BLOG 생성배경기존에 유지하고 있는 블로그는 지금 EC2 + S3 + RDS등 AWS 서비스를 사용하고 있으며,매달 금액을 지불하고 있다.소규모 웹사이트 이기도 하고 별도의 런타임 되는 서버는 필요 없다고 생각되어 vercel과 Supabase로 변경하여 비용을 없애기로 하였다.또 React + Express로 구현되었기 때문에 SEO에 매우 취약하기도 하고 Next 캐싱을 이용해서트래픽을 최소화 하기 위한 목적으로 제작되었으며,이후 템플릿겸 판매를 위해서도 서버리스 환경에서 구동되는 것이 유리하다 판단하여 Next.js로 구현하기로 하였다.목적은 비주얼 적으로 화려함보다 아닌 기본 기능을 견고하게 구현하고자 하였고고정 콘텐츠 삽입이나 캐러셀의 순서 변경 등 일반적인 CMS 블로그들의 기능을 포함하여 구현해보고 싶었다.원래는 SSE나 Websoket을 통해서 알람 같은기능을 추가하고 싶었으나일반 Blog에서는 과한 것 같아 서버리스에 배포할 수 있는 기능만 반영하였다.기존
최신 글
[정보처리기사] 비전공자 정보처리기사 필기 후기*(feat. 2주일)
2020년 이후 정보처리기사는 개정 이후 어려워 졌다는 이야기를 많이 들었다.3년 웹개발 경력이 있고, sqld자격증이 있는 상태로 어느정도 sql문은 할줄 아는 수준에서 공부를 시작하였다.#정보처리기사는 2020년에 개정되었다.기존 정보처리기사는 다른 기사를 취득하기위한 '동일 기사 보유' 자격을 얻기 위해서 취득할 정도로 매우 쉬운 자격증이었다. 가끔 보면 기출문제기사 라고 조롱 받는 기사였다.위 사진은 #2020년 이후 개정된 정보처리기사 합격률이다. 필기는 무난한 수준의 합격률을 보여주지만 실기는 합격 난이도가 점점 높아지는 것을 볼 수있다.2023년엔 평균 20% 초반대의 합격률을 보여준다. 이제는 예전처럼 시험 전날 3일정도 보고 가서 치는 시험은 아니다.필기야 아직 문제은행 식으로 출제되지만 수험자들의 목표는 '취득'이 최종 목표기 때문에 실기를 치뤄야 한다.실기는 단답형 위주 출제형식이며, 가끔 서술형문제도 출제된다.필기의 범위와 실기의 범위는 겹치는 부분이 있기에 필
0 025. 06. 20
정보보안기사 - 암호학
해시함수해시함수란 입력 메세지를 받아 128bit ~ 512bit의 고정된 길이를 갖는 N비트 문자를 반환한다.일 방향성을 가지며 계산된 해시 값은 역산이 불가한다라는 성질을 가지며,다대일 대응 함수로 동일한 해시값을 가진 평문이 존재한다. (해시충돌)충돌저항성1) 프리이미지 저항성 ( 역상 저항성 )y=H(M)을 보고 y=H(M’)를 만족하는 M’를 찾아낸다는 것이 매우 힘들어야 하나는 성질2) 제2 프리이미지 저항성 ( 약한 충돌 내성 )공격자는 (M)만 알지만, (M’) = (M)의 만족하는 M’을 찾음 다만 위험성이 낮음무차별 공격3) 충돌 저항성 ( 강한 충돌 내성 )두 값을 모르지만 가장 위험도가 높음,생일 패러독스 공격전용해시함수해시함수는 SHA-1, RIPEMD , RIPEMD-128 , RIPEMD-160 , HAVAL 등은 모두 MD4를 기초로 디자인함메세지 다이제이스트(해시 값 ) MD2→MD4→MD5의 MD 알고리즘이 있으며 , RSA와 함께 개발함SHADSS에
0 025. 06. 19
정보보안기사 2025년 2회차 필기 비전공 후기 ( 3주 공부 )
정보보안 기사를 시작한 계기6월 13일 정보보안기사 필기를 경찰병원역에서 응시하였다.비 전공 출신으로 CS에 대한 지식을 넓히기엔 적절하다고 생각하여 시작하였고,정보처리기사와 더불어 한가지의 기사를 더 취득하고싶어 시작하게 되었다.정보보안기사를 보려면 시스템보안, 네트워크 보안 등을 알려면 자연스레 운영체제, 네트워크 등을 알아야 하기 때문에CS지식을 복습할 수 있는 기회가 되고 특히 네트워크 보안은 웹 개발에 있어서 빠져서는 안될 부분 이기에제대로 알아두고 싶었기 때문이다.이 기사의 난이도는 익히들어 알고있다.정보처리기사도 2020년 이후 개정 되어 많이 어려워 진 것은 사실이나필기의 경우는 사실 기출만 돌려도 붙을 수 있는 수준이다.하지만 보안기사는 필기부터 다르단 소리를 예전 부터 들어왔고 3개월 전에 알기사로 추천 받아서 구매하였다.엄청 두껍다… 이론 1, 이론 2, 기출 1200제 , 요약 본 해서 4가지시작은 3개월 전이지만 공부 기간은 3주시작은 3개월 전에 시작하였지만
0 025. 06. 13
Promise 상태에 대한 처리와 Promise 메소드
Promise프로미스는 JS에서 비동기를 동기적으로 실행 할 수 있도록 해주는 중요 단위이자 개념이다.await와 asnyc를 떠나 Promise의 상태에 대한 체이닝과 try catch의 핸들링,그리고 Promise의 메소드 들에 대해 알아 보도록 한다.Promise 상태 ⭐⭐프로미스는 성공, 실패 그리고 대기 상태로 나뉘어 상태를 반환한다.초기 상태를 pending 결과 상태를 resolve()를 따른 fullfilled , reject()로 실패를 나타내는 rejected 로 반환한다.출처- MDC예시로 함수로 가정한다면 보통 asnyc 함수 내 await를 선언한 비동기 메소드를 실행 하게 될텐데이때 Async는 즉시 프로미스를 반환하게 되고 “Pending” 상태를 유지한다.await에서 rejected 상태를 반환 되었다면 이 상태를 throw로 에러를 전파한다.이때 함수는 더이상 실행되지 않고 Async 함수의 프로미스를 “Rejected”로 반환시키며,보통 try ca
0 025. 05. 27
