Intro 항상 나만의 블로그를 만들어 보고싶다는 생각만하고 실천해보지 못하였는데 넥스트에서 제공하는 템플릿중에 마크다운으로 블로그를 만들 수 있게 되어있어서 테스트 해보는 과정을 작성해보고 싶어졌다. 템플릿 설치 방법 템플릿 레포 경로 : https://github.com/vercel/next.js/tree/canary/examples/blog-star...

이전에는 MUI에서 Drawer 컴포넌트의 SwipeableDrawer컴포넌트(링크(https://mui.com/material-ui/react-drawer/차 후 직접 구현해야하는 사람들에게 도움이 되고자 이 글을 작성한다.바텀시트(Bottom Sheet)

디자인 시안을 가지고 tailwindcss를 사용하면 가장 신경쓰였던 부분은figma에서 px기준으로 디자인을 잡아야 할 때 테일윈드에서 기본적으로 제공하는 단위는rem단위이기에 정확하게 처리하고 싶어서 커스텀해서 px단위도 vscode에 자동완성이 되도록 작업해보았다

nextjs 13버전 이전에는import { useRouter } from 'next/router'; 를 사용해서 손쉽게쿼리를 조작하고, 패스네임을 판단 할 수 있었다.하지만, 이번에 useRouter, usePathname, useSearchParams 등... 으로

참고 영상 : \[A2] 모두를 위한 모바일웹: 접근성을 준수해서 스크린리더 UX 개선하기이전 프로젝트에서는 MUI와 같은 CSS라이브러리를 쓰면서 웹접근성은 크게 생각도 해보지 않았으며, 라이브러리가 알아서 해주리라 생각을 해왔다.물론, 지금 리뉴얼하고 있는 프로젝트

넥스트 13이전에는 useRouter를써서 쿼리스트링을 수정하여 데이터를 패칭받으면서리액트보다 훨씬 간결하게 처리가 가능하구나 생각하면서 사용해왔다.하지만 next 13버전으로 업그레이드 되면서 app디렉토리를 사용 할 경우 는 사용되지 않으며, 이런식으로 next/n

이번에 회사에서 리뉴얼 프로젝트가 시작되어 Next.js 신규 버전인 13버전과 더불어기존에 사용하고 있던 MUI css라이브러리를 사용하지 않고, tailwindcss로 작업을 하기로 했다.기존 프로젝트에서는 Next.js를 썼지만 getStaticProps, get

프로그래머스 '2022 Dev-Matching: 웹 프론트엔드 개발자(상반기)'기출 문제 해설을 참고하여 작성하였습니다.index.js : App.js의 로직을 index.html에 보여주는 역할App.js : 전역 상태를 관리하면서 아래 3개의 컴포넌트를 연결시켜주는

2022.10.26(수)에 진행 된 Next Conf에서 Next.js 신버전인 Next.js 13버전이 출시되었습니다.아직 알파, 베타기능들이 더 많지만 서버사이드 기능 강화로 Next.js의 역할이 더욱 강해지지 않을까 생각됩니다.추가로, 기존에 쓰던 사용법이 많이