Dug_House

문제 상황 Warning: Prop `style` did not match. Server: "null" Client: "min-width:;height:" 원인 Next.js는 SSR을 하기에 서버에서 생성된 컴포넌트와 CSR로 클라이언트에서 생성된 컴포넌트의 클래스명이 서로 달라지게 된다. 게다가 Fullcalendar라이브러리는 SSR을 지원하지 않는다. 해결법 그렇기에 클라이언트에서만 렌더링을 해야한다. Next.js에서 제공하는 dynamic import를 사용한다. export const CalendarPage = () => { const Calendars = dynamic(() => import('./components/Calendar'), { ssr: false, }); return ( );..

내 인생에 취업을 해야 하는 시즌이다. 내 목표는 막연히 첫 직장은 대기업이다. 내 주변 사람들에게 나 이런 사람이야! 나 엄청 노력했어 대단하지?! 이런 것을 보여주고 싶었나보다. 그런데 현실의 벽에 잠시 걸음이 멈췄다. 코딩 테스트를 준비하고 CS지식을 공부하면서 만약 다 통과 했고 면접에 들어간다면 나의 프로젝트들에 대해서 말할텐데 그때는 몰랐던 것들을 지금은 알고 나니 부족한 것들이 너무 많이 보여서 내가 면접장에 간다면 “저것들이 내 약점이 되지 않을까”라는 고민과 점점 내가 무슨 대기업이야 하면서 눈을 낮추고 내 스스로가 우물 안의 개구리라고 느껴졌다. 시맨틱 마크업 고려하지 않음form태그 사용없이 바로 onClick 해서 서버에 전송반응형 처리 부족크로스 브라우징 안함기타 등등 이렇게 고민..

2022년 11월 15일 서류 합격과 필기 시험을 합격하고 실무 면접을 보았다. 면접은 면접과 4명 지원자 2명 다 대 다 면접 형식이었다. 면접을 보며 느낀점과 고민들에 대해서.... 말투 ~입니다 VS ~요 에대해서 면접에서 뭐가 더 좋을까에 대한 고민을 했는데 억지로 불편한 ~입니다에 맞추는 것보다 ~요도 예의도 있고 정중해보이기에 자신에게 맞는 말투를 사용하면 좋을 것 같다. 중요한 건 내가 상대방에게 배려를 하고 있고 정중히 대한다는 느낌을 주는 것! 좋아하니까 잘한다? 남이 시켜서 억지로 하는게 아닌 좋아서 하니까 더 잘할 수 있다! 스스로 해석 해보니 이 말은 “억지로 하는 사람들보단 내가 잘할 수 있다! “라는 말이다. 나는 좋아하기에 꾸준히 열정을 갖고 지속할 수 있다는 것을 강조하고 싶..

나는 내 주변인들에게 “나는 문서화하는 것을 좋아하고 잘해!”라고 말한다.문서화 한다는 것나는 내가 만난 개념과 에러들에 대해서 해결 과정을 겪으며 원인과 해결을 문서화해놓는 것이 그 당시에 나는 생각정리를 할 수 있어서 좋고 또 미래에 같은 에러를 겪으면 해당 문서를 보고 해결하고 또 불특정 다수가 같은 에러를 만났을 때 내 문서를 보고 해결할 수 있으니 1석 2조를 넘어선 좋은 장점이구나라고 생각을 했다. 면접에서 문서화 능력이 프론트엔드 직무만의 강점은 아니라는 평가를 받았다.백엔드, 데이터베이스, AI 등 모두 문서화하는 능력은 필요하다는 것이었다. 당신이 프론트엔드에서의 장점은 무엇인지에 대해서 얘기해달라고 했다.대답은 잘하지 못하였다, 그저 문서화 한다는 것에 대한 나 스스로 자부심이 있었나 ..

this란 누가 함수를 호출 했는지를 명시한다 함수를 호출할 때 결정된다. 누구인가? 누가 날 불렀어 - 궁예 == this - 일반함수 : 함수 호출을 한 위치에 따라서 this를 동적으로 결정한다. 그렇지 않게 하려면 this를 바인딩을 해야 한다 화살표 함수 : 함수를 선언했을 때 this가 정적으로 상위 스코프의 this를 가리키고 이것을 Lexical this라고 한다 자세히 ... https://sanghoon98.notion.site/JS-this-c585a8fd19af4f64a25bda752c1fcab9 JS의 this 누가 함수를 호출했는지를 명시한다. sanghoon98.notion.site

보시기 전에 요약하자면 화살표 함수는 선언시의 this를 상위 scope의 this를 갖는데 그냥 함수는 어디서 호출하냐에 따라 this가 변하기 때문에 화살표 함수를 사용하는 것이 좋다 라는 것 입니다. 개인 노션에 정리한 내용입니다. https://sanghoon98.notion.site/d626f610c25247be839aa082b413a19f 화살표 함수 사용 이유 내가 내린 결론 sanghoon98.notion.site

웹 표준 (Web Standards) 웹에서 표준적으로 사용되는 기술이나 규칙 standard(표준)보다는 권고안(recomendation)에 가깝다. HTML, CSS, JavaScript에 대한 규정을 담고 있다. 웹 표준의 궁극적인 목적은 웹사이트에 접속한 사용자가 어떠한 운영체제나 브라우저를 사용하더라도 동일한 결과를 보이게 하는 것이다. 웹 접근성, 웹 호환성, 웹 사용성은 모두 웹 표준을 지키기 위해 생긴 개념들이다. 웹 표준을 따를 때 장점 다양한 브라우저나 새로운 기기에서도 올바르게 표시된다. 접근성 향상 검색 엔진 최적화(SEO) meta 요소를 이용한 정확한 문서 정보의 제공과 적절한 제목(heading)의 사용, 의미에 맞는 마크업은 검색 시 결과에 영향을 미치는 중요한 정보이다. 쉬..

XSS (Cross-Site Scritping) 줄이면 CSS인데 Cascading Style Sheet와 혼동이 올 수 있어서 XSS라고 부르는 것이다. 웹 페이지에 악의적인 스크립트를 삽입해 방문자들의 정보를 탈취한다. 의도치 않은 비정상적인 기능 수행을 유발한다. 쿠키나 세션, 토큰을 탈취한다. 공격 대상 스크립트 언어 ex) javascript 취약한 코드 보안 방법 입력할 때와 출력할 때, 모두 필터링하고, 클라이언트에도 막을 수 있을만한 수단을 구성해놓는 것이 좋다 HTML 태그의 사용을 제한하거나 스크립트에 삽입되지 않도록 & 등의 문자를 다른 문자로 치환함으로써 방지한다. CSRF (Cross-site request forgery) 사이트 간 요청 위조 공격자가 사용자에게 특정 행동..