재희의 일상 블로그

1. this 차이const user = { name: 'jane', sayName: function () { // 일반함수 console.log(this.name); },};const user2 = { name: 'lulu', sayName: () => { // 화살표 함수 console.log(this.name); //this는 window를 가리킴 },};user.sayName(); // janeuser2.sayName(); // undefined 일반 함수에서 this는 함수를 호출한 객체를 가리키게 되며,화살표 함수는 this를 감싸고 있는 스코프의 this를 가지고 온다.객체의 메소드로는 일반 함수를 사용하는 것이 좋다.화살표 함수로 메소드를 정의하면 생성한 객체에 접근..

ESM이란자바스크립트 공식 표준 모듈 시스템과거에는 require, module.exports와 같은 CommonJS(CJS) 방식을 사용했지만, ES6(ECMAScript 2015) 이후부터 ESM이 정식으로 도입되었다.모듈을 나누고 가져오는 방식이 정적(Static)이며, 런타임이 아니라 컴파일 시점에 의존성을 파악할 수 있다. CJS 방법// calculator.jsconst add = (a, b) => a + b;const subtract = (a, b) => a + b;module.exports = { add, subtract}// main.jsconst calculator = require('./calculator');console.log(calculator.add(1, 2)) // 3cons..

create react app으로 만든 react 앱에서 jest를 실행하려고 보니cannot find module 'react-router-dom' 오류가 생겼다.평소 개발할 때에는 오류가 없었는데 테스트에서만 생겨서 여기저기 찾아봤다.일단 나는 react 18 버전을 사용 중이다.시행착오 1 (실패)우선 ‘react-router-dom’을 'react-router'로 변경하고 react-router 모듈을 설치했다.import { BrowserRouter } from 'react-router-dom' //제거import { BrowserRouter } from 'react-router' //추가npm i react-router 변경 후 테스트를 실행하면 아래처럼 에러가 뜬다ReferenceError:..

안녕하세요!얼마 전 엄마랑 후쿠오카 여행 중에 마사지샵 Thaichai를 방문했는데요, 너무 괜찮아서 이렇게 후기를 남기러 왔습니다.위치는 하카타역에서 도보로 10분 정도 떨어져 있어요.예약 가격이 저렴해서 미리 예약하고 가시는 걸 추천해요!▼ 구글맵 링크https://maps.app.goo.gl/dMaNhrTBhJiZhh2Z6?g_st=ac タイ古式 タイちゃい · Fukuoka, Fukuoka www.google.com▼ 예약 링크https://www.peakmanager.com/online/index/b3n5g5 タイちゃい オンライン予約おかげさまでタイちゃいは、１１月９日に11周年を迎えることとなりました。 数あるマッサージサロンの中から当店を選んでお越しいただきましたこと、心より感謝しております。 これからwww.p..

가끔 이런 더보기 디자인이 오면 구현의 어려움이 있었습니다. 일단 내가 원하는 곳에서 텍스트를 자르는 방법이 없었고 줄 단위로만 가능했던 터라 디자이너와 협의 후 더보기 버튼을 아래로 내리거나 아예 없애는 방식을 제안했을 거예요. 오늘은 위와 같은 디자인을 개발하는 방법을 알아보도록 하겠습니다. 더보기 UI 구현하기 ui는 다음 사이트를 참고했습니다. https://jsbin.com/bebuwuhibe/1/edit?html,css,output JS Bin Sample of the bin: jsbin.com 일단 간단하게 html과 scss를 다음과 같이 적어주면. 아래와 같은 UI가 나올 것입니다. 끓는 방황하여도, 그들의 밥을 힘차게 원대하고, 가치를 같이, 것이다. 전인 방황하였으며, 열락의 생생하며..