본문 바로가기

frontend11

[팁] javascript console 객체 알아보기 console.log(obj)를 사용하지 말고 console.log(JSON.parse(JSON.stringify(obj))) 자바스크립트를 이용해서 개발해 오면서 변수의 값을 확인하거나 디버그 용도로 항상 console.log 메소드를 사용해 왔다. 그러던 중 우연히 console에 다른 메소드는 없을까 궁금증이 생겼고, 구글에 javascript console에 대해 검색하니 console에는 다양한 메소드가 있는 것 같았다. 그것도 당연한 것이, console 역시 기정의된 객체이므로 그 안에 log 말고도 다양한 메소드나 속성이 있을 것이다. 다만 항상 당연하게 log만 사용해서 다른 옵션에 대해 생각해 보지 못한 것이다. https://developer.mozilla.org/ko/docs/Web.. 2022. 3. 1.
[팁] Array.splice로 배열 전체 replace하기! 전부터 자바스크립트를 공부하고, 실제로 개발해오면서 굉장히 유용하게 잘 썼던 함수가 Array의 splice 함수이다. array를 변경할 일이 있을 때 insert / delete / replace 모두 파라미터를 적절히 넣는다면 잘 동작하기 때문이다. https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Array/splice Array.prototype.splice() - JavaScript | MDN splice() 메서드는 배열의 기존 요소를 삭제 또는 교체하거나 새 요소를 추가하여 배열의 내용을 변경합니다. developer.mozilla.org 이번에 vue로 프론트엔드를 개발하던 중 배열 전체를 repla.. 2022. 2. 11.
Tailwindcss 적용해보기! 프로젝트를 진행하면서 프론트엔드 작업을 할 일이 많은데, 이전에 쓰던 vuetify를 걷어내고, tailwindcss를 적용해 보기로 하였다. https://tailwindcss.com/docs/installation Installation: Tailwind CLI - Tailwind CSS Documentation for the Tailwind CSS framework. tailwindcss.com Tailwindcss는 vuetify와 같은 라이브러리들이 컴포넌트를 만들어 놓고, 이 컴포넌트를 사용자 취향에 맞게 사용하는 것과 다르게 꼭 필요한 속성들을 class로 만들어놓고, 그 class들을 선택해서 사용하는 방식이다. 따라서 특정 프레임워크에 종속적이지 않고, 자유도가 높다. 다만, 컴포넌트들이.. 2022. 2. 5.