Univdev
취소

Svelte에 적용하는 Typescript

개요 이번에 토이프로젝트를 제작하기 위해 Sapper + Typescript를 사용해보기로 결정했습니다. 원래는 Nuxt3를 써보려 했는데 아직 정식 릴리즈가 되지 않아 Sapper가 좀 더 끌리더라구요. Sapper란? Svelte에 서버 엔진을 붙인 프레임워크입니다. React의 Next.js, Vue의 Nuxt를 생각해보시면 될 것 같아요. 설치...

탁월한 개발자

개요 최근에 여러 기업에 면접을 보러다녔는데 그 중 어떤 기업에서의 임원면접에서 들은 질문입니다. “찬영님이 생각하시기에 탁월한 개발자란 뭐라고 생각하세요?” 이 질문을 처음 들었을 때 약간의 생각에 잠겼습니다. 일단 질문 자체가 막연히 ‘탁월함’에 대한 정의를 요구하고 있기 때문이기도 했고, ‘일을 잘하는 사람’에 대한 기준은 가끔 생각하던 것이였...

JSDoc으로 Javascript 문서를 좀 더 친절하게 만들어보자

JSDoc JSDoc은 Javascript로 작성 된 문서에서 각 변수나 함수 등에 의미를 부여하기 위한 마크업 언어입니다. 이를 이용하면 VSCode와 같은 개발 툴에서 특정 함수를 사용할 때, 이 함수가 어떤 역할을 하는지 혹은 어떤 변수를 파라미터로 전달 받는지 등을 툴팁 형태로 띄워줄 수 있습니다. 태그 @author 이 코드를 작성한 개...

평문을 HTML로 변환하기

기능 textarea 형태의 에디터에서 작성 된 글은 평문으로 작성됩니다. 이를 HTML 문서에서 보여주게 된다면 줄내림 등의 양식이 적용되지 않기에, 이를 변환시켜주는 함수입니다. 덤으로 https://www.naver.com 같은 링크가 들어오면 a 태그를 래핑하는 기능도 포함 되었습니다. 코드 /** text2html * 텍스트를 html 형...

Github Issue로 오픈소스 기여하기

오픈소스 오늘날의 IT업계는 수많은 오픈소스로 운영되고 있습니다. 누군가는 자신의 커리어를 위해서, 누군가는 그저 취미로, 누군가는 돈을 벌기 위해서 오픈소스를 생성하고 사용합니다. 결과물로 직접적인 수익을 낼 수 없음에도 불구하고 오픈소스 시장은 나날이 성장하며 많은 개발자들이 참여하고 있습니다. ‘오픈소스’라는 이름을 들으면 좀 어려워보이고, 전...

텍스트 안에 있는 URL에 하이퍼링크 적용하기

개요 네이버 블로그, 티스토리 등 고급 에디터를 지원하는 서비스에는 게시글을 작성할 때 링크를 포함시키면 해당 링크에 <a> 태그가 자동으로 걸리는 기능이 있습니다. 이 기능을 구현하기 위해서는 평문 속 URI를 찾고, replace 시켜야 합니다. 소스코드 <template> <div class="index"> ...

내가 쓰는 Nuxt3 ESLint 설정

패키지 설치 yarn yarn add -D eslint eslint-plugin-vue typescript @typescript-eslint/eslint-plugin @typescript-eslint/parser vite-plugin-eslint @nuxtjs/eslint-config-typescript npm npm i -D eslint eslin...

em과 rem의 차이

개요 CSS는 DOM에 style을 적용해주기 위한 언어입니다. 그러다보니 화면을 구성하는 DOM에 적절한 길이를 적용하기 위해 다양한 길이 단위를 사용합니다. 대표적으로 사용되는 길이 단위는 px, em, rem 등이 있는데, px의 경우는 그 역할이 굉장히 직관적입니다. 입력하는 길이만큼 크기가 지정되고 그게 끝이기 때문이예요. 그런데 em과 r...