본문 바로가기

WEB

 (5)
[JS] Fuse.js 지난 포스트에서 손글씨를 텍스트로 추출하는 과정을 보였다.최대한 높은 정확도로 손글씨를 텍스트화 하였지만, 여전히 남은 오차를 줄일 방법이 필요했다.다른 라이브러리나 api 혹은 전처리나 후처리 등이 많이 있겠지만, 일단 서비스의 환경에 포인트를 맞추기로 하였다. 다행히도 해당 서비스에는 이미 작성된 유저 리스트가 존재한다.그 말은 즉, 유사한 텍스트로만 추출해도 비교를 통해 유추해낼 수 있다는 뜻이다.덕분에 어려운 길로 가지 않고 간단히 처리해볼 수 있었다. 흔히 검색 등에 사용되는 fuzzy-search 라이브러리인 Fuse.js를 여기에 적용해 볼 것이다.fuzzy-search란 간단히 말하면 입력받은 문자(패턴)과 유사한 문자열을 검색하는 '유사 검색'기술이다. 일단 설치부터 한다.npm i fu..
[JS] Promise Promisepromise는 자바스크립트에서 이전 코드의 처리가 완료되기 전에 다음 코드를 실행하는 '비동기 처리'를 위한 객체이다. 이 비동기 처리의 특성에 의한 문제 중 하나가 이전 코드의 작업의 결과가 준비되지 않아 다음 코드 실행 시에 발생하는 에러이다.이를 해결하기 위한 단순한 방법은 콜백 헬이 발생하는 방법인데, 간단히 소개하자면db.query(query, param, (err, result) => { if (err) //에러 처리 db.query(query2, result.data, (err, result2) => { if (err) //에러 처리 db.query(query3, result2.data, (err, result3) => { if (e..
[JS] 옵셔널 체이닝: "?." 웹을 만들다 보면, 특히 데이터를 다룰때 흔히 볼 수 있는 " TypeError: "로 시작하는 에러가 있다.이 에러는 많은 경우에서 어떤 데이터를 가져올 때 그 값이 ' undefined '이거나 ' null '인 경우에 발생한다. 물론 데이터가 없으면 표현되어서는 안되는 것도 있지만, 종종 데이터가 존재하지 않으면 존재하지 않는 대로 랜더링은 지속해야하는 경우가 있다.그럴때 사용하는 문법이 옵셔널 체이닝, ' ?. ' 이다. const users = [{ name: "홍길동", age: 20 }, { name: "김철수", age: 26 }];const userPh = users[0].ph; //TypeError: Cannot read property 'ph' of undefinedconst use..
[HTML] POST방식으로 데이터 전달받기 이전 포스트에서 text타입 input과 textarea로 각각 title과 description을 전송하였었다. 말그대로 전송만 하였을뿐 이 데이터를 캐치해서 활용해줄 방식은 다음과 같다. var qs = require('querystring'); var body = ''; request.on('data', function(data){ body += data; }); request.on('end', function(){ var post = qs.parse(body); var title = post.title; var description = post.description; }); 조각 조각 들어오는 데이터를 data로 받아 body에 하나로 모은다. 데이터 전송이 끝나면 이를 객체화 하여 변수에 저장한다.
[HTML] Form Form input, textarea 등의 폼 요소를 이용해 웹 제작자가 아닌 웹 사용자에게도 문서를 작성해 게시할 수 있는 기회를 제공할 수 있다. 위처럼 작성된 코드에서는 박스에 정보를 입력하고 제출을 눌러도 아무런 변화가 일어나지 않는다. 하지만 다음과 같이 form 태그를 사용하면 원하는 링크로 정보를 전달할 수 있다. //action을 통해 보내고자 하는 링크를 지정 //각 박스마다 name을 지정해주지 않으면 값이 전달되지 않음 폼 태그는 method라는 속성을 가지며 GET과 POST 두가지로 나뉜다 . GET과 POST 둘 다 웹브라우저에서 폼 데이터를 받아 서버로 전송하는 역할을 하나 GET은 URL의 쿼리 스트링으로 붙여 전송하고, POST는 숨겨서 보내는 차이가 있다. (쿼리 스트링(..

티스토리툴바