Bleeding edge

고민하게 된 계기 git을 CLI를 이용하면서, push를 할 때마다 브랜치 이름을 입력하는 것이 너무 번거로웠다. 그래서 현재 브랜치에 push를 해야하는 경우에 간단하게 push하는 방법에 대한 것을 알아보았다. 어떤 방법을 사용할까? git push git push 뒤에 아무 브랜치 이름도 안넣는 경우 현재 branch로 push하게 하도록 옵션을 바꾸는 방법 extension vs code에 extension을 이용해서 해결하는 방법 cli 1와 같은 방법중에서 current의 브랜치를 직접 지정하는 방법 오늘 이 글에서는 이 방법중에서 1번 방법에 대해 알아보자 git push.default option nothing 명시적으로 Refspec이 제공되지 않는 한 어떤 것도 푸시하지 않습니다.(오..

고민한 이유 보통 before이나 after에는 background-image에 이미지 파일만 사용하여 처리를 많이한다. 하지만 이미지를 올리기 힘든 경우에는 어떻게 처리하는게 좋을까? SVG Tag 이미 이미지 파일 없이 우리는 svg tag를 이용하여 html에 벡터를 사용해본 사람이 많을 것이라고 생각한다. javascript에서 createURLObject를 이용하면 없는 파일을 텍스트로 만드는 것처럼 CSS에서도 이런 방법이 있지 않을까? SVG URL-encoder https://yoksel.github.io/url-encoder/ 이 페이지에 들어가면, svg를 URL-encoder로 바꾸어 주는 기능이 있다. 이것을 이용하면 요런 svg Element를 사이트에서 변환하면 Ready for..

이 주제를 공부한 이유 개발자 커뮤니티 슬랙에서, 브라우저에서 txt나 zip와 같은 파일을 open할 수 있는 지에 대한 질문이 올라왔다. 이 질문을 읽었을 때 브라우저에서는 로컬에 파일이 접근이 안되지 않나..? 근데 어떤 웹들을 보면 또 접근이 가능하게 구현한 것 같은데? 재밌어 보여서 시작했다.. 접근 방법 1. 파일을 어떻게 열까? 가장 먼저 생각나는 방법으로 window.open을 사용하였다! Not allowed to load local resource: 역시 브라우저에서는, load local resource에 대해 접근을 막고 있었다.. 2. Mdn에서 정의하는 window.open을 보자 MDN의 window.load를 보면 첫 번째 파라미터가 URL or path라는 것을 볼 수 있다..

이전에 Context API를 선택했던 이유 전역상태를 관리하는 파일을 최대한 가볍게 하고 싶어서, 이미 내장되어있고, 자주 바꾸지 않기 때문에 Context API를 사용 했었는데 지금 고민해보니 굳이 Context API에 대해 다시 한번 고민을 하게 되었다. 다시 고민하게 된 이유 1. 내정되면 가벼운가? 번들링을 이용하면 필요한 함수만 불러 오기 때문에 Context API가 리액트에 있다고 하더라도 Context API를 사용하지 않는다면 Context API는 사용되고 있지 않았을 것이다 즉 Context API를 사용한 것과 만일 바꾸게 될 새로운 전역 변수 함수에 대해서 고민해보면 React(ContextAPI를 제외한 일부) + Context API + BOJ React(ContextAP..

이 글은 Github의 web editor를 이용하여 pull request를 로컬로 가져오는 방법을 소개하는 글입니다. Pull request를 Git command로 가져오는 방법은 구글에 Git request 로컬로 쉽게 와 같은 키워드를 검색하면 찾을 수 있다. 진행방법 요약 Step 1. Web editor 열기 Step 2. Terminal 열기 Step 3. 다음에 대한 작업 계속하기 Step 4. 리포지토리를 로컬로 복제하고 데스크톱에서 열기 Step 5. Visaul studio Code로 실행 Step 6. Select as Repository Destination (저장할 폴더 클릭하기) 글을 작성하게 된 계기 이전에 진행했었던 팀프로젝트와는 다른 특징이 세개가 있었다. 1. 각자 독..

프로젝트를 시작하게 된 계기 Notion prettier는 현재 진행하고 있는 오픈소스 프로젝트 팀원이 노션에 코드를 작성하면서 텝이나 스페이스바를 연타하는 것을 보면서, 노션에 프리티어를 적용하면 어떨까요? 라고 내가 팀원에게 물어보면서 그런게 있으면 당장 쓸 것 같아요 라는 이야기를 듣고나서 시작했다. 프로젝트 이름 정하기 Markdown helper 처음에는 이름이 Markdown helper라는 이름으로 프로젝트를 만들었는데, 다른 사람에게 프로젝트를 설명할 때 프로젝트 이름만으로는 프로젝트를 설명하는 것이 어려워서, 이름으로 프로젝트를 쉽게 설명하는 이름이 없을까 고민하다가 Notion에서 Prettier를 사용하니 Notion Prettier로 하는게 어떨까 하고 변경했다. (지은게 아니라 그..

문제점 자동완성의 keyword의 symbol을 나타내는 폰트에 문제가 있었다. 문제 원인 자동완성이 뜨기 이전까지는 볼 수 없는데.. 이 현상은 con와 같이 자동완성이 가능한 keyword가 있을 때 폰트를 request하면서 문제가 생긴다. 해결책 평범한 web에서는 아마 이러한 문제가 생기지 않았겠지만, chrome extension에서는 내가 웹주소에 폰트를 올릴 수 없기 떄문에 이러한 문제가 생길 수 있다. 이 문제를 node module에 있는 monaco editor에서 찾는다는 것은.. 잘못된 방법이고, 최종적으로 생성되는 파일의 e.exports=n.p+"b797181c93b3755f4fa1.ttf" 이 부분을 수정할 필요가 있었다. 이 파일이 실행될 경로에 자동으로 생성될 텍스트 파일..

올해 시작 2022년 1월 말에 일을 그만두고 개발을 시작하기로 결심하고 제로베이스의 커넥투에서 진행하는 (전 네카라쿠배 스쿨)에 들어가는 것을 1차 목표로, 그리고 교육이 끝난 후에는 원하는 기업에 들어가는 것을 목표로 공부를 시작하였다. 올해 목표 올해 1월에 일을 그만두고 개발을 시작하면서, 제로베이스에서 진행하는 커넥투(전 네카라쿠배 스쿨)에 들어가는 공부를 첫 번째 목표로 하고, 두 번째로는 이후에 워하는 기업에 들어가는 것을 목표로 공부를 시작하였다. 위 두 목표를 이루기 위해서는 저 목표를 이루기 위해 좀 더 세밀한 목표를 세울 필요가 있었다. 1. 글쓰기(문서정리) 커넥투에서 글을 정말 잘쓰는 분을 봤었는데, 프로젝트가 끝나면서 그 프로젝트에서 무엇을 배웠고 무엇을 고민했는지와 같은 프로젝..

Why? 리액트에서 페이지 이동을 할 때 페이지가 이전 페이지의 위치가 유지되는 현상이 있었다. SPA에서 다른 페이지로 이동할 때 자연스러운 느낌이 들지 않아서 페이지를 위로 올려주는 방법이 필요했다. 해결방법 import {useEffect} from "react" import {useLocation} from "react-route-dom" export function Component(){ const {pathname} = useLocation(); useEffect(()=>{ document.querySelector('#scrolled-it').scrollTo(0,0) }, [pathname]) ... } 고민해야할 것 scroll이 되는 대상은 스크롤이 내려진 component이기 때문에 스크..