◈ Yermi Project
[Toy Project] URL 단축기를 만들어보자!✂️ [서버 구축하기 싫어서 DB는 Google Sheets로 대체]
- URL 단축기를 만들어보자! 이번에는 URL 단축기를 만들어보았다. URL 단축기의 프로세스는 아래와 같다. URL 단축을 위해 해싱은 6자리로 정했다. (겹치는 값이 나올 정도로 사람들이 많이 사용해주면 좋겠다⭐) [JS] 긴 문자열을 6자리 해시로 변환하기 [간단한 해싱 알고리즘 만들기] - 긴 문자열을 6자리 해시로 변환하기 JavaScript에서 긴 문자열을 6자리 해시로 변환하는 방법 중 하나는 SHA-256 등의 안전한 해시 알고리즘을 사용하고 그 결과를 base64 또는 다른 방법으로 인코딩 yermi.tistory.com 서버 구축하기 싫어서 Google Sheet와 Google App Script를 활용했다. (배포는 당연히 github 웹배포~) 지금은 github의 도메인을 쓰고 ..
[Toy Project] 식당 메뉴판 만들기🍖 (feat. CORS의 늪에 빠지다.) [axios, iframe 등을 활용한 네이버 블로그 스크랩핑 시도]
- 식당 메뉴판 만들기 (feat. CORS의 늪에 빠지다.) 회사 근처에는 '밥플러스'라는 한식뷔페가 있다. 정말 맛있다. 이 곳은 약 6개의 지점을 운영하는데 블로그에 메뉴판을 게시하기에 그 메뉴판을 한 곳에 모으는 페이지를 만들어보려고 했다..🥲 밥플러스 2호점(메타모르포점) 오늘의 메뉴 밥플러스 2호점(메타모르포점) 석식은 운영하지 않습니다. 메타모르포점 셀프도시락은 종료되었습니다. | ... blog.naver.com - axios를 활용한 스크랩핑 온전히 Web에서만 동작하도록 만들려고 했었다. 이에 JavaScript의 axios를 사용했다. 처음엔 매우 순조로웠다. 그러나.. // 지정된 ID를 가진 유저에 대한 요청 axios.get('http://naver.com') .then(func..
[Project] 조크베어(joke-bear) 메인페이지 테이블 구조 및 레이아웃 초안 [짜장 vs 짬뽕을 논하는 우리들의 커뮤니티]
- 조크베어 메인페이지 테이블 구조 및 레이아웃 초안 조크베어의 메인페이지 레이아웃이 나왔다. (feat. 나당쓰) 긴 시간이 흐른 뒤.. 테이블 구조를 담고 있는 ERD가 나타났다. 처음부터 완벽하게 설계하고 만들면 좋겠으나.. 진척이 없을 듯 하여 우선은 프로젝트를 돌릴 수 있게 기본적인 것만 갖고 가자는 마음으로 시작했다. (나중에 설계미스로 만나게 될 부분들이 두렵지만 그 또한 공부가 되고 양분이 되지 않겠는가..🥲🥲) 오늘도 한 걸음 더 나아가며, 끗.
[Toy Project] 네이버 환율을 스크랩핑 해보자!💱 [Java로 만든 환율계산기]
- 네이버 환율을 스크랩핑 해보자! 네이버 환율을 스크랩핑하여 환율계산기를 만들어보았다. Jsoup과 Gson을 활용했다. [Library] Jsoup으로 웹 페이지 크롤링(Crawling)하기 [parsing 라이브러리 : Jsoup] 1. parsing 라이브러리 : Jsoup - 다운로드 : https://mvnrepository.com/artifact/org.jsoup/jsoup/1.14.3 2. Jsoup으로 웹 페이지 크롤링하기[웹 페이지에 있는 썸네일 저장하기] - DB 테이블 생성 : TBL_MUSINSA_SAMPLE - HTMLPars yermi.tistory.com [Library] 자바(Java)로 제이슨(Json) 출력하기 [Json 라이브러리, Gson] 1. Json 라이브러리,..
[Toy Project] 이번에는 웹 페이지 오목이다(2)🎲 [JavaScript로 오목 로직 구현하기]
- 이번에는 웹 페이지 오목이다(2) 1. 화점 찍어주기 바둑판에 화점이 없으니 너무 밋밋하여 위치 계산하여 찍어주었다. for(var i = 0 ; i < 3 ; i++) { for(var j = 0 ; j < 3 ; j++) { let dot = document.createElement('div'); dot.setAttribute('class', 'dot'); let margin_top = 58 + (i * 120); let margin_left = 58 + (j * 120); dot.setAttribute('style', `margin-top: ${margin_top}px; margin-left: ${margin_left}px;`); board.appendChild(dot); } } 2. 오목 로직..