egg.dev.log

심심해서 정리하는 옵시디언 개요 노트 정리 방법 PARA 옵시디언 정리 전 옵시디언 정리 후 노트 정리 방법 PARA 세컨드 브레인을 읽고 예전에 정리한 내용입니다. PARA와 CODE로 제 2의 뇌를 만들자 - Tiago Forte PARA Project 마감과 기한이 정해져 있는 목표 목표와 시간이 정해져 있다는 것!! Area 일생동안 지속적으로 유지해야 하는 활동 기한이나 마감이 정해져 있지 않다는 것!! 건강, 재산, 여행, 공부, 취미 등 Resource 지속적인 관심을 갖는 어떤 주제나 분야 내가 관심을 가지고 있는 모든 것!! 맛집, 아티스트, 노래, 영화, 도서 등 Archive 위의 내용에서 완료된 주제나 관심에서 멀어진 주제의 내용 지금 당장은 필요없지만 다시 꺼낼 수 있는 정보나 자..

심심해서 정리하는 옵시디언 개요캔버스 노트캔버스에서 문서 연결하기여러 요소를 그룹으로 묶기 아래 사진은 아이패드에서 옵시디언을 켜서 캔버스로 만든 마인드맵입니다. 캔버스 노트마인드맵을 그릴 수 있는 노트라고 생각하면 좋습니다. 다만, 이제 노트를 불러와서 보여줄 수 있는! 위의 사진에서 하단을 보면 세가지 아이콘이 있습니다. 해당 아이콘은 차례대로 카드, 노트, 사진입니다. 카드는 직접 내용을 쓸 수 있습니다. 자유롭게 크기를 조절해서 마크다운 문법을 적용하여 사용할 수 있습니다. 해당 내용을 바로 노트로 만드는 것도 가능합니다.노트는 이미 작성된 노트를 가져와 임베드할 수 있습니다. 임베드는 노트의 일부를 미리보기 식으로 보여준다고 생각하시면 됩니다.사진은 로컬에서 별도의 사진을 불러와 적용할 수 있습..

심심해서 정리하는 옵시디언 개요 그래프뷰 백링크와 아웃링크 문서에 링크 추가하기 *편의상 ``으로 감싸고 있으나, 실제 사용할 때는 ``을 제외하고 써주세요! 그래프뷰 옵시디언에서 문서끼리 연결시킬 수 있습니다. 마크다운 문법으로 `[대체텍스트](링크)` 혹은 `[[링크]]` 이며, 이렇게 다른 문서의 링크가 남으면 문서끼리 연결되는 선이 생깁니다. 위 사진에서도 이미지 파일들(노란점)을 첨부했더니 해당 파일들을 문서(검은점)이 가리키고 있습니다. 기존의 파일 시스템에서는 A 폴더 내부에 있는 a 문서와 B 폴더 내부에 있는 b 문서 간의 접점을 알기 어려웠습니다. 그리고 서로 연간되어 있지만, 주제가 다르다는 이유로 다른 폴더에 넣는 찝찝한 경험을 많이 했었습니다. 옵시디언은 이를 그래프뷰를 통해 어떤..

심심해서 정리하는 옵시디언 개요 마크다운 목 마크다운 글꼴 스타일 마크다운 인용, 이모지, 테이블, 링크, 리스트, 구분선 마크다운 코드블록 마크다운 콜아웃 대체로 옵시디언의 마크다운은 깃허브의 마크다운과 같습니다. 다만 차이가 있다면 깃허브의 md 파일의 경우 마크업 문법도 사용가능한 반면, 옵시디언의 마크다운은 마크업 문법을 사용하지 못합니다. 그대로 마크업이 드러나 이상하게 깨지기도 합니다. 블로그의 텍스트 에디터와 비교하며 마크다운 문법에 대해 설명해 보겠습니다. 영어를 읽을 줄 안다! 하시는 분들은 아래 사이트가 옵시디언의 마크다운을 설명해 주는 공식 사이트입니다. https://help.obsidian.md/Contributing+to+Obsidian/Style+guide#Markdown St..

✨문제 설명 문자열을 압축하는 방법 | 정해진 길이로 문자열을 압축했을 때, 압축된 문자열의 수를 앞에 써주고, 뒤에 해당 문자열이 오도록 배치합니다. 예시로 `aabbccc`라는 문자열은 1의 길이로 압축했을 때, `2a2b3c`가 되며, 2의 길이로 압축했을 때 `aabbccc` 로 압축횟수가 1인 경우 생략하여 표기합니다. 따라서 이번 입력값의 압축 시 최소 길이는 6입니다. 파라미터 | 압축할 문자열 s 조건 | s의 길이는 1 이상 1,000 이하입니다. s는 알파벳 소문자로만 이루어져 있습니다. 입출력 예sresult 리턴값 | 압축한 문자열 중 가장 짧은 길이 🤔풀이 방법 1. 문자열을 자르는 길이가 일정하므로, 해당 길이만큼 문자열을 미리 잘라놓는 방법 > split 메서드를 통해 문자열을..

심심해서 정리하는 옵시디언 이전 글 바로가기 >> 2024.01.20 - [Update/tools] - [옵시디언] 시작하기 개요 설정에 대한 설명 코어 플러그인 데일리 노트 템플릿 설정에 대한 설명 왼쪽 맨 하단에 보면 설정 아이콘이 있습니다. 아이콘 클릭 시 보이는 화면입니다. 크게 옵션과 코어 플러그인이 있고, 나중에 커뮤니티 플러그인을 설치하면 왼쪽 리스트 하단에 커뮤니티 플러그인 섹션도 생깁니다. * 한국어로 설정되었을 때를 기준으로 설명합니다. 테마가 다를 수 있습니다. 각 옵션에 대한 간략한 설명입니다. 옵시디언 정보 - 옵시디언 업데이트, 자동 업데이트 설정, 언어 설정, 옵시디언 계정 연동 편집기 - 노트에 대한 설정(개인적으로 하나씩 바꿔보면서 맞추는 곳) 파일 및 링크 - 파일 삭제,..

심심해서 정리하는 옵시디언 개요 옵시디언이란? 공식 사이트 소개 윈도우용으로 설치하기 vault, 보관소 생성하기 새로운 폴더, 파일 생성하기 주요 아이콘 설명 옵시디언이란? *마크다운 형식으로 기록을 관리할 수 있는 어플로 데스크톱, 패드, 모바일 모두 사용이 가능합니다. 다만, 각각 개별로 저장할 수도, 연동하여 사용할 수도 있습니다. 쉽게 말하자면 커스터마이징이 정말 잘 되는, 메모장을 관리하는 어플? 연동을 위해서는 Obsidian Sync 라는 동기화 기능을 결제해야 하며, 달에 8달러 정도입니다. 그래서 깃허브를 사용할 수 있다면 데스크톱끼리는 깃허브를 통해 연동을 해놓고 사용하기도 합니다. 기본적으로 정말 개인이 기록하기 위해 사용할 수도 있고, 깃허브나 블로그에 연동하여 문서를 관리하는 용..

🐾들어가며 여러가지 스터디를 진행하면서 어떻게 기록을 잘 남길 수 있을까 고민했습니다. 기록을 한 곳에 축적하여 히스토리가 생겨야 한다. 기록을 꾸준히 주기적으로 남겨야 한다. 위의 두 가지 조건을 모두 충족하면서 앞으로도 계속 쓰게 될 깃허브를 선택했습니다. 처음에는 깃허브로 쓰는 것이 어색했지만, 이제는 옵시디언과 같이 사용하여 md 파일을 잘 관리할 수 있게 되었고, 다른 사람들과 협업하는 것도 익숙해져서 이번 스터디에서는 깃허브에 기록하는 것을 적극적으로 하고 있습니다. 그래서 이번에 어떻게 깃허브를 이용하여 스터디를 진행하는지 남겨보려고 합니다! ✨본격적으로 ✅커밋을 활용하자 현재 운영체제 책을 읽고 정리하여 퀴즈까지 준비하는 스터디를 하고 있습니다. 그래서 정리한 내용을 한 곳에서 공유할 수 ..

게시글의 이미지를 보여주는 컴포넌트 내부에서 if 문을 통해 여러 return을 하고 있습니다. 그래서 하나의 컴포넌트 안에서 조건부로 나뉘는 게 아닌 조건에 맞는 컴포넌트들로 각각 나누어 사용해보는 것으로 하였습니다. 이번에 배운 컴파운드 컴포넌트 패턴을 적용하여 Image라는 객체에 넣어 관리하려고 했습니다. 기존 코드 import styled from 'styled-components'; import { Swiper, SwiperSlide } from 'swiper/react'; import 'swiper/css'; import imageBigIcon from '../../assets/img/image-big-icon.svg'; import deleteIcon from '../../assets/im..

🐾들어가며 원티드 프리온보딩 강의에서 추상화를 할 때 함수의 역할에 따라 추상화하여 분리하는 방법을 배웠습니다. 그래서 직접 쓴 코드에서 해당 내용을 토대로 적용을 해보려고 합니다. ✨본격적으로 ✅함수 분리하기 기존 코드 입니다. 프로젝트에서 복잡한 로직을 사용하지 않아서 겨우 찾아냈습니다. import React, { useRef, useEffect } from 'react'; import styled from 'styled-components'; const ResizingTextarea = ({ onChange, ...props }) => { const textareaRef = useRef(); useEffect(() => { handleResizeHeight(); }, [props.value]); ..