에바니네

Intl 국제화표준 API

갑자기 유튜브 알고리즘에 의한 것인지 모르겠지만 Intl 이라는 Javascript 내장 API에 대한 설명해주는 영상을 보고 충격을 받았다. 자바스크립트 자체적으로 지원해주는 format API가 있다니.. 그래서 바로 MDN에 검색해봤다. 일단 인트로만 가져와보았다. Intl The Intl object is the namespace for the ECMAScript Internationalization API, which provides language-sensitive string comparison, number formatting, and date and time formatting. The Intl object provides access to several constructors as we..

스위치 구문에 Default 생략에 관해서

우테코 과제를 하다가 가독성을 위해 Switch문을 사용하게 되었다. 그런데 나는 앞서서 유효성검사를 했기 때문에 경우의 수가 무조건 딱 떨어지는 상황이었다. 이것에 관련해서 default를 굳이 사용해야할까? 라는 생각이 들었는데 이유는 우테코 과제를 하다보면 함수의 길이를 10줄 아래로 제한하기 때문이다. 그래서 구글링하고 stackoverflow의 나같은 생각을 한 친구의 질문에 답변들을 알아봅시당. https://stackoverflow.com/questions/8021321/what-if-i-dont-write-default-in-switch-case What if I don't write default in switch case? int a = 10; switch(a){ case 0: prin..

VSCODE Syntax Highlighting이 안될 때

일단 필자는 갑자기 오늘 어떤 시점부터 갑자기 코드에서 하이라이팅이 brascket만 먹는 버그가 발생했습니다. 상단의 이미지 같이 코드가 계속해서 나와서 일단 syntax Highlight 라는 키워드로 열심히 구글링을 했습니다. 1. 일단 현재 언어가 코드에 맞게 설정 되있는지 확인 2. 세팅에서 아래 기능이 언체크가 되어있는지 확인 ( 필자는 세팅에서 찾지 못함 ) 3. 그냥 껏다 켜보기 정도 였는데 그래도 해결이 안됬다. 이유를 몰라서 매우 화나던 와중에 https://github.com/microsoft/vscode/issues/166525#issuecomment-1317981911 My text font color is bugged · Issue #166525 · microsoft/vscode..

MVC를 이용한 간단한 TODO JS (번역)

그냥 공부 목적으로 번역을 하면서 읽은 것을 옮겨 적어보았습니다. 오역이 있다면 알려주세요 감사합니다 ~ Model View Controller 란 무엇인가 ? MVC는 코드를 조직화를 위한 하나의 유명한 디자인 패턴입니다. Model - App의 데이터를 관리합니다. View - Model의 시각적인 표현을 담당합니다. Controller - User와 System간을 연결합니다. Model이 곧 데이터고 이 APP에서는 실질적인 투두리스트인것입니다. 그리고 메소드로 추가, 수정, 삭제를 가질 것입니다. View는 데이터의 표현입니다. 이 어플리케이션에서는 HTML을 DOM과 CSS안에 렌더를 할 것입니다. Controller는 Model과 View를 이어주며, 사용자의 입력과, 클릭, 타이핑 같은 유..

router.push vs Link vs a 태그

넥스트로 라우팅하다보니 문득 router.push와 Link 태그 그리고 a태그가 뭔 차이가 있고 무슨 어디에 써야하는지 몰라서 검색해봤다. https://stackoverflow.com/questions/65086108/next-js-link-vs-router-push-vs-a-tag Next.JS "Link" vs "router.push()" vs "a" tag Newbie here, sorry if this is extremely basic question but I'm not able to wrap my head around which technique should be followed to navigate across various pages. As of now I know three diffe..

CSR(Client Side Rendering) vs SSR(Server Side Rendering)

리액트 강의를 보다가 클라이언트 사이드 렌더링과 서버 사이드 렌더링의 차이를 보다가 궁금해서 더 찾아보고 작성 해봅니다. 클라이언트 사이드 렌더링과 서버 사이드 렌더링의 동작 순서 클라이언트 사이드 렌더링 1. 서버가 Response를 브라우저에게 보냅니다. 2. 브라우저는 자바스크립트 파일을 다운로드 합니다. 3. 브라우저는 자바스크립트 다운로드를 마치고 리액트를 실행하게 됩니다. 4. 리액트 실행하고 나면 페이지가 보이고 상호작용이 가능해집니다. 서버 사이드 렌더링 1. 서버가 렌더링이 준비된 HTML Response를 브라우저에 전송합니다. 2. 브라우저는 페이지를 렌더하고, 요소들은 보이나 아직 브라우저는 자바스크립트를 다운 받고 있습니다. 3. 자바스크립트 다운이 끝나고 리액트를 실행합니다. 4..

$(document).ready() 는 바닐라 자바스크립트로 ?

Jquery $( document ).ready(function() { console.log( "ready!" ); }); Vanila JS document.addEventListener('DOMContentLoaded', () => { console.log('document's ready'); }); addEventListner에 저런 속성이 있는줄 몰랐서.. 잊지않기위해 이런 배운거를 써넣어갈 생각이다.