본문 바로가기

분류 전체보기

 (250)
2020.11.16 오늘의 커밋. 미래에 대하여 오늘은 prisma 기반의 MBTI 웹사이트를 설계하고 간단한 graphql 거래까지 작성해놓았습니다. 또, 동적기획법의 메모이제이션 방법에 대하여 어느정도 보았고, 새로운 알고리즘 문제(외발뛰기)를 훑어보았습니다. '천천히 흘러가도 흘러가야 합니다.' 고등학교때 알고리즘을 공부하던 사이트 더블릿의 타이틀이자, 제가 제일 좋아하는 문장입니다. 10년이 지난 지금도 이 문장을 기억할만큼 좋아했지만, '너는 천천히라도 흘러가고 있었나?'라고 묻는다면 자신있게 대답할 수 없을 것 같습니다. 그나마 최근에 들어서야 강제로라도 습관을 만드는 방법을 찾게되어 어떻게든 흘러가고는 있지만요. 조금만 더 일찍 깨달았다면 저는 분명 더 나은 사람이 되었을텐데 라는 후회가 밀려오긴 합니다. 어떻게든 흘러만 가면 도랑에서 강..
2020.11.10 오늘의 커밋. React에서 Bottom이 Fixed일때 화면 크기에 따라 스크롤 자동 생성, 겹침 발생하지 않도록 처리. 오전에 간단하게 처리하려고 했던 내용입니다. 프론트앤드 개발자 단톡방에 물어봤던 내용. 현재 위 앱은 아이폰5나 아이폰se1과 같이 매우 작은 해상도의 스마트폰에서는 footer영역과 main 영역이 겹치는 문제가 있었습니다. 이유는 footer의 css가 아래와 같이 되어있기 때문이었죠. footer { width: 100%; position: absolute; bottom: 0; text-align: center; color: white; background: #80808030; } 위치가 고정이므로, dom에서 스크롤을 생성하기 위한 공간을 차지하지 않습니다. 구글링해보면 저와 같은 고민을 했던 개발자의 질문이 있죠 (검색 키워드 : footer position fixed overlap) stack..
2020.11.09 오늘의 커밋. 영어공부 어플 완성! 오늘은 Duou lingo를 대략적으로 완성하였습니다. 대략 한달 걸렸군요. Duou lingo는 출퇴근길에 듀오링고를 통해 공부하다가 너무 지루했던 제가 재미있는 주제로 영어공부를 해보려는 요량으로 만든 영어공부 웹앱입니다. 내용은 간단합니다. 매일 바뀌는 BBC의 실시간 헤드라인 뉴스제목과 내용을 아래 버튼을 참고하여 해석하면 됩니다. 대략 하루에 50개정도의 뉴스가 보입니다. duolingo.com 무료로 외국어를 배우세요. 게임을 통해 영어를 비롯한 다양한 언어를 배워보세요. 100% 무료로 제공되는, 게임처럼 재미있고 과학적으로 효과가 검증된 언어 학습 앱입니다. www.duolingo.com PC버전과 모바일버전 모두 지원하며, PC버전에서는 드래그, 모바일 버전에서는 터치 드래그 기능을 통해..
React에서 서버에 데이터 요청하고 화면에 표시하기 오늘 해볼 것은 아래와 같다. 1. 외국 사이트에서 문장을 크롤링(사실 파싱이 맞다)하여 화면에 표시(파싱) 1.1 Python(BeautifulSoup)을 통해 외국사이트에서 특정 키워드를 추출하여 배열로 return 하기 1.2 Python에서 리턴한 데이터를 node에서 받아와 GET 웹서비스로 만들기 1.3 React 기반 웹에서 node 서비스를 호출하고, 화면에 '예쁘게' 표시하기 { //뉴스 가져오는 로직 const response = await fetch('http://localhost:3000/viewNews') const body = await (response).json() console.log(body) //버튼 목록 만드는 로직 /* */ //점수 계산하는 로직 /* */ } 이런..
Python에서 리턴한 데이터를 node에서 받아와 GET 웹서비스로 만들기 오늘 해볼 것은 아래와 같다. 1. 외국 사이트에서 문장을 크롤링(사실 파싱이 맞다)하여 화면에 표시(파싱) 1.1 Python(BeautifulSoup)을 통해 외국사이트에서 특정 키워드를 추출하여 배열로 return 하기 1.2 Python에서 리턴한 데이터를 node에서 받아와 GET 웹서비스로 만들기
2020.10.27 오늘의 커밋. 경험치 회사에서 공부하다가 새로운 사실을 알게되었다. 물론 ES6의 표준은 var 대신 let이나 const를 사용하도록 되어있지만, 나는 알고리즘 문제를 풀때 개발자 도구를 이용하며, 코드를 실행할때마다 화면을 재시작하지 않기 때문에, let과 const처럼 재선언이 불가능한 코드를 사용하기에 많이 불편했다. 또한 회사에서 주로 사용하는 언어가 ES6가 아니기 때문에 실제 업무에서 자주 사용하지도 않았다. 결국은 핑계지만 var를 엄청나게 사용한다. 그러다보니 알게 되었는데 변수 이름으로 name을 사용하면 안된다. window.name은 정해져있는 property이기 때문이다. var name = 100; console.log(name); => "100" name은 굉장히 자주 쓰는 변수명인데, 혹시라도 v..
Python을 통한 BBC 뉴스 크롤링하기 이전 글에서 설명한 것처럼 뉴스를 파싱해보도록 하자. 오늘 해볼 것은 아래와 같다. 1. 외국 사이트에서 문장을 크롤링(사실 파싱이 맞다)하여 화면에 표시(파싱) 1.1 Python(BeautifulSoup)을 통해 외국사이트에서 특정 키워드를 추출하여 배열로 return 하기 1.2 Python에서 리턴한 데이터를 node에서 받아와 GET 웹서비스로 만들기 1.3 React 기반 웹에서 node 서비스를 호출하고, 화면에 '예쁘게' 표시하기 굳이 파이썬을 통해 파싱할 필요는 없지만 추후 확장성을 고려하여 BeautifulSoup를 사용할 수 있는 Python을 선택했으나, 얼마든지 자바스크립트를 사용해도 된다. 우선 파싱할 페이지는 feeds.bbci.co.uk/news/rss.xml 이다. BBC의..
BBC를 크롤링하여 웹사이트에 뿌리고, 파파고를 이용하여 번역하는 사이트를 만들어보자. 본인은 영어를 그리 잘하지 못하지만 영어 공부에는 관심이 많다. 코딩을 하다보면 생기는 문제들에 대한 대부분의 답은 영어로 찾을 수 있고, 그나마 찾은 답을 해석하다가 사소한 부분에서 오역이 발생하면 한참을 더 헤매야 하기 때문이다. 이때문에 매일 영어 공부를 하고 있는데 주로 듀오링고 를 이용하여 공부하고 있다. www.duolingo.com/learn 무료로 외국어를 배우세요. 게임을 통해 영어를 비롯한 다양한 언어를 배워보세요. 100% 무료로 제공되는, 게임처럼 재미있고 과학적으로 효과가 검증된 언어 학습 앱입니다. www.duolingo.com 듀오링고는 단순하다. 영어 문장을 해석하거나, 한글로 된 문장을 영작하는것을 무한하게 반복하는것. 물론 번역기와는 차원이 다른 퀄리티에, 하나의 문장을 ..

티스토리툴바