프로그래밍(Basic)

[바미] 바벨(Babel)에 대하여

1. 배경 1.1 크로스 브라우징 사용하는 말이 달라서 바벨탑이 실패했듯이, 브라우져마다 사용하는 언어가 달라서 프론트엔트 코드는 일관적이지 못할 때가 많습니다. 스팩과 브라우져가 개선되고 있지만, 여전히 인터넷 익스플로러는 프라미스를 이해하지 못합니다. 작년까지만 해도 사파리 최신 브라우져는 Promise.prototype.finally 메소드를 사용할 수 없었습니다. 히브리어로 바벨이 '혼돈'이란 뜻인 것처럼 프론트엔드 개발에서 크로스브라우징 이슈는 코드의 일관성을 해치고 초심자를 불안하게 만듭니다. 크로스브라우징의 혼란을 해결해 줄 수 있는 것이 바벨이죠. ECMAScript2015+로 작성한 코드를 모든 브라우져에서 동작하도록 호환성을 지켜주는데 타입스크립트, JSX처럼 다른 언어로 분류되는 것도..

[바미] Node SQL 파라미터 적용 방법.

오늘은 SQL을 사용하실 때 URL의 특정 값을 파라미터에 넣고 싶을 때 사용하는 방법에 대해 포스팅해보려 합니다. 위와 같은 URL이 있을 때 '카카오'를 SQL로 검색할 때 다음과 같이 작성해주시면 됩니다. app.get('/search=?', function(req, res) { let sql = 'select * from Company where Name = ?'; let params = req.query.name; conn.query(sql , params, function(err, row, fields){//row => 결과값 if(err){ console.log(err); } if(row.length > 0) { console.log("hey!!!!", req.query.name) } els..

[바미] 검색Form검색 이벤트 추가.

부트스트랩 기준으로 공유합니다. 검색 form Search Node.js const express = require('express'); const app = express(); const mysql = require('mysql'); // mysql 접속 설정 const conn = mysql.createConnection({ host : 'localhost', port : '3306', user : 'user', password : 'password', database : 'DB이름' }); app.get('/search=?', function(req, res) { let sql = '사용하실 SQL 쓰시면 됩니다.'; conn.query(sql , function(err, row, fields){/..

[바미] script 태그에 Node.js DB 데이터 넣기

보통 Node에서 DB데이터를 가져와 ejs 파일에 넣으려 할 때 태그를 사용하여 형태로 사용하실 겁니다. 카카오 맵을 사용하다보니

[바미] DB에 float 데이터를 저장하기.

개발 언어에서는 실수형 데이터를 float 타입으로 선언하곤 합니다. 이 때문에 DB를 구성할 때도 실수형 데이터가 저장될 열을 FLOAT 타입으로 선언하게 되는데요. ALTER TABLE 테이블이름 ADD COLUMN 컬럼이름 FLOAT; 이런식으로 선언 시 데이터를 저장한 다음 평균을 내거나 합계를 낼 때 조금씩 차이가 나는 현상이 발생하고, 소수점이 조금 긴 데이터를 저장 시 소수점 몇자리부터 짤리는 현상을 경험하여 알게 되었습니다. 이유는 바로 FLOAT 타입이 근사 값을 저장하기 때문이였습니다. 이 부분은 FLOAT, REAL, DOUBLE PRECISION 모두 동일하였습니다. msdn에서도 다음과 같이 설명하고 있는데요. 부동 소수점 데이터는 근사 값이므로 해당 데이터 형식 범위에 있는 모든..

[바미] Go의 signal에 대해 알아봅시다.

BackEnd단에서 프로그램을 Go언어로 짜다 보면 Go 프로그램이 Unix signal을 처리해 주었으면 하는 때가 있죠. 예를 들어, SIGTERM signal을 받았을 때 적절하게 서버를 종료하는 경우나 커맨드라인 도구에서 SIGINT를 받았을 때 프로세스를 멈추는 경우가 그런 경우인데요. 오늘은 채널을 이용하여 signal을 다루는 방법을 살펴보겠습니다. 코드 package main import "fmt" import "os" import "os/signal" import "syscall" func main() { sigs := make(chan os.Signal, 1) done := make(chan bool, 1) signal.Notify(sigs, syscall.SIGINT, syscall...

[바미] MVC, MVP, MVVM 패턴에 대해 알아봅시다.

MVC 패턴 MVC 패턴은 크게 Model-View-Controller 3가지로 나눈 소프트웨어 개발 방법론입니다. Model : 일반적으로 DB테이블에 해당한다. 순수한 데이터로서 DB의 역할을 하거나 DB에 데이터를 요청해서 원하는 데이터를 받는 역할을 합니다. 사용자가 편집하길 원하는 모든 데이터를 가지고 있어야 하고 View나 Controller에 대한 정보는 알수없습니다. View : Controller로 데이터를 받아서 클라이언트 측 기술인 html/css/javascript를 이용해 표현하는 역할을 합니다. 데이터를 따로 보관하지 않고 처리합니다. Controller : 사용자가 접근 한 URL에 따라서 사용자의 요청사항을 파악한 후에 그 요청에 맞는 데이터를 Model에 의뢰하고, Mode..

[바미] Array 중복된 id값 제거하기.

Array 내에 id 값이 중복된 것을 제거하는 작업은 정말 많이 쓰이죠. 여러 방법으로 제거 하는 방법을 알려드리겠습니다. let example = [{ id: "무지", value: "1" },{ id: "보르도", value: "2" }, { id: "무지", value: "1" }, { id: "콘", value: "3" }]; 위와 같은 배열이 있을 때 id값이 중복된 것을 제거 해보도록 하겠습니다. lodash _.uniqBy(example, "id"); lodash를 사용하면 위와 같이 한 줄로 가능합니다. 참고로 lodash 라이브러리는 자바스크립트로 개발시 가장 많이 사용되는 라이브러리 중에 하나입니다. array 를 다룰때 번거로움을 없애고 쉽게 사용할 수 있도록 해줄뿐만 아니라 obj..

[바미] RxJS - BehaviorSubject

안녕하세요. 오늘은 BehaviorSubject에 대해 알아보고자 합니다. 먼저 BehaviorSubject는 모든 새 구독에 저장하고 내보내는 현재 값의 개념이 있는 주제의 변형입니다 . 이 현재 값은 소스 Observable에 의해 가장 최근에 방출된 항목이거나 아직 방출되지 않은 경우 시드/기본값입니다. 항상 현재 값이 BehaviorSubject있어야 하므로 초기화 시 초기 값이 필요합니다. 구독 시 마지막으로 내보낸 값을 원하지만 시드 값을 제공하지 않으려면 대신 ReplaySubject 를 확인하세요. BehaviorSubject이 동작은 구독자가 값이 저장된 것보다 훨씬 늦게 구독하더라도 항상 마지막으로 내보낸 값을 직접 가져올 수 있음을 의미합니다 . 관찰자가 a BehaviorSubjec..