본문 바로가기

Dev Talks78

Javascript Call Stack - 자바스크립트 기초 공부 #1 자바스크립트 기초 내공을 쌓기 위해 자바스크립트 개발자라면 알아야 하는 기본 개념들을 정리하고 있습니다. 이번 글에서는 그 첫 번째로 Javascript Call Stack에 대해서 살펴보도록 하죠. 용어정리먼저 용어부터 정리하도록 하죠. 자바스크립트 콜스택은 영어로 Javascript Call Stack으로 쓰이고 우리말로 번역하여 자바스크립트 호출 스택이라고도 합니다. 이 글에서는 한글로 "자바스크립트 콜스택"이라고 표기하겠습니다. 자바스크립트 콜스택 이란?자바스크립트는 콜스택은 자바스크립트 함수를 호출하는 매커니즘을 말합니다. 스택이란 하나씩 쌓았다가 가장 위에 있는 것부터 차례대로 쓰는 방식(LIFO, Last In First Out)이죠. 따라서 자바스크립트 콜스택은 호출할 함수를 스택으로 쌓아.. 2019. 3. 12.
Sass 문법 정리 (mixin, include, expend, partial, import, if문) Sass 문법 중에 1) mixin과 include, 2) %와 extend 그리고 3) partial과 import 문법에 대해서 알아보도록 하겠습니다. 참고로 Sass의 이 세 가지 문법은 코드 재사용 기능을 위한 문법이라고 할 수 있습니다. 1. @mixin 과 @includemixin은 자바스크립트의 function처럼 사용할 수 있는 Sass 문법입니다. 인자 값을 넘길 수도 있고, 각 인자마다 기본 값 줄 수도 있습니다. [선언] @mixin fontSizeBgColor($fontSize : 40px, $bgColor : #fff) { font-size : $fontSize; background-color : $bgColor;} [사용] #box { @include fontSizeBogColo.. 2019. 2. 8.
Sass 사용법 및 Sass 문법 공부 방법 정리 프론트엔드 프로젝트를 하다 보면 복잡하고 방대한 양의 CSS 코드를 어떻게 유지 보수할까 하는 고민에 빠진다. Sass로 CSS를 관리해야겠다는 생각은 오래전부터 하고 있었는데, 그동안 프레임워크 공부에 빠져 있다 보니 Sass 공부를 계속 미뤄왔다. 그러다 이번에 제대로 Sass 사용법 및 Sacs 문법을 독파하자는 목표를 세웠고 그 내용을 정리해봤다. 1. Sass css 차이2. Sass를 사용하는 이유3. Sass 문법 종류4. Sass 출력 스타일5. Sass 주석6. Sass 변수7. Sass 문법을 더 공부하려면?8. Sass 참고 URL 모음1. Sass CSS 차이?먼저 개념부터 잡고 가자. Sass에 대해 잘 모르는 사람은 Sass와 CSS가 어떤 차이가 있는지 묻는다. 그런데 엄밀히 .. 2019. 2. 5.
페이스북 API 연동 및 개발 방법 정리 페이스북 페이지를 운영하면서 포스팅 자동화 방법을 찾다가 직접 프로그램을 개발하기로 하였습니다. 그러면서 Google API와 Facebook API를 사용하게 되었는데요. 지난번 Google API 개발 방법 정리에 이어 이번에는 Facebook API 연동 및 개발 방법을 정리해봤습니다. 1. 페이스북 앱 개발 과정 개요 2. 페이스북 API 종류 3. 페이스북 그래프 API와 SDK 4. 페이스북 개발자 계정 생성과 앱 등록 5. 사용자 엑세스 토큰 발급 6. 페이지/그룹 엑세스 토큰 발급 7. 페이스북 앱 검수1. 페이스북 앱 개발 과정 개요페이스북 API를 사용하려면 다음과 같은 과정을 거쳐야 합니다. 페이스북 개발자 계정 생성 -> 앱 등록 및 앱 ID 생성 -> 엑세스 토큰 발급 -> 앱 개.. 2019. 2. 2.
구글 API 사용법, 키 발급, OAuth 인증 방법 정리 구글 api 활용 방법만 잘 알아도 다양한 종류의 구글 서비스를 이용할 수 있습니다. 저 역시 여러 종류의 구글 서비스를 이용해서 api 연동을 하고 서비스에 적용하고 있습니다. 오늘 포스팅에서는 구글 API 사용법과 관련해서 API 키 발급 과정과 API 연동 방법에 대해서 알아볼까 합니다. 구글 API 사용법은 다음과 같은 절차로 진행이 됩니다. 1. 구글 API 콘솔에서 프로젝트 생성 2. 구글 API 라이브러리 선택 3. 구글 OAuth 인증정보 만들기 4. 구글 API 인증정보 적용 5. 구글 계정으로 앱 권한 허용 6. 구글 API 인증 token 받기 7. 구글 API 연동 프로그램 개발1. 구글 API 콘솔 프로젝트 생성▼ 먼저 구글 API Console에 접속합니다. 구글 API 대시보드.. 2019. 2. 2.
머신러닝 공부 순서, 방법 및 강의 정리 이번 포스팅에서는 작년부터 머신러닝 공부를 시작하면서 들었던 강의와 머신러닝 공부 방법에 대해서 정리해보려고 한다. 필자도 아직 머신러닝을 마스터하려면 갈 길이 멀었지만, 그간 공부했던 경험을 토대로 머신러닝 입문자들에게 조금이나마 도움이 됐으면 하는 마음으로 적어봤다. ※ 주의 : 이 글은 이제 막 머신러닝을 공부하려는 입문자를 위한 글입니다. 이미 머신러닝을 많이 공부하신 분들에게는 별로 도움이 되지 않을 것입니다. 우선 필자에 대해 간략하게 소개하자면, 한국에서 자바 개발자로 시작해 이 후 여러 모바일 웹앱 프로젝트를 하면서 프론트엔드 개발자로 커리어를 바꾼 9년 차 개발자이다. 어쩌다 지금은 미국으로 건너와 1인 개발자로 일하고 있다. 필자가 미국으로 건너 오게 된 이야기는 부끄럽지만 나의 퇴사 .. 2019. 1. 16.
Mysql Workbench 폰트 및 테마 변경 방법 다양한 ERD 툴이 있지만 그 중에서 제가 가장 애용하는 툴은 Mysql Workbench 입니다. 오픈소스이면서 무료로 사용할 수 있는 Community 버전(Workbench CE)을 사용하더라도 원하는 기능을 대부분 사용할 수 있기 때문입니다. 오늘은 처음 워크밴치를 설치하고 폰트나 테마를 변경하려고 하는 분들을 위해 폰트, 테마 변경 방법을 정리해봤습니다. ▼ 먼저 폰토 변경 방법부터 살펴보죠. Mysql Workbench를 처음 설치하면 폰트 사이즈가 10정도로 굉장히 작습니다. 저도 처음 설치하고 글씨가 잘 안보여서 폰트를 더 크게 했는데요. 폰트를 변경하려면 Edit > Preferences > Fon & Colors로 들어가면 됩니다. ▼ 폰트를 변경하려면 폰트 이름 + 사이즈를 직접 적어.. 2019. 1. 3.
PHP를 활용한 웹페이지 파싱 기법 요약 가끔 사이트 개발을 하거나 여러가지 데이터를 모으기 위해 웹페이지를 파싱해야할 경우가 있죠. 다양한 언어와 기법을 활용하여 웹페이지 파싱이 가능한데요. 저는 주로 PHP를 활용하여 웹페이지 스크랩하고 정규표현식을 통해 파싱 작업을 하고 있습니다. 그 내용을 간단하게 요약해 보도록 하죠. 파싱 대상 html 가져오기1. echo file_get_contents(웹페이지 URL); => 서버 설정으로 막힌 경우가 많음. 2. curl (스누피라는 라이브러리 쓰면 좀 편함) 3. fsocketopen (최종 방법) 파싱할 때 주로 쓰는 함수 5가지1. str_replace(".", "", $string); // . 삭제 2. $language = preg_replace( '/[^a-zA-Z_]/', '', $.. 2017. 11. 15.
phpMyAdmin 에 csv 파일 import 방법 및 에러 대처 가끔 엑셀에 있는 데이터를 MySQL DB에 넣어야 할 때가 있는데요. 맥북이나 리눅스에서는 수월하게 잘 되던 작업이 윈도우 MS-Excel 2007 을 통해서는 잘 안되는 경우가 있더군요. 특히 "Invalid column count in CSV input on line" 과 같은 에러가 나는 경우가 있는데요. 아래 방법으로 해결하였습니다. ▼ 우선 MS-Excel 2007 에서 작성된 파일을 csv 파일로 저장하여야 하는데요. 엑셀파일에서 csv 로 저장할 때는 한 탭에 대해서만 저장을 하여야 합니다. 따라서 엑셀 탭별로 우클릭 후 이동/복사 > 복사본 만들기 체크 > 새 통합문서로 저장한 후 csv (쉼표로 분리)로 저장합니다. 그리고 DB 테이블의 컬럼 개수에 일치하도록 조정을 해주고 다시 저장합.. 2017. 9. 13.
크롬 개발자모드 콘솔에서 jQuery 사용하는 방법 크롬 개발자모드는 프론트 앤드 개발하는데 있어서 필수적으로 사용하는 툴이죠. 디버깅 기능을 포함하여 강력한 개발 툴을 지원해주고 있는데요. 가끔 사이트 분석을 할 때 콘솔에서 jQuery 명령어를 쓰고 싶을 때가 있죠. ▼ 우선 크롬 Developer Tool 에서 다음과 같은 코드를 복사 후 실행하면 jQuery 기능을 사용할 수 있습니다. var jq = document.createElement('script'); jq.src = "//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"; document.getElementsByTagName('head')[0].appendChild(jq); // ... give time for script to load, .. 2017. 8. 25.
정규표현식 치트 시트 정규표현식은 쓸 때마다 헷갈리죠. 분명 공부를 다했다고 했는데 한동안 안쓰다가 막상 개발할 때 쓰려고 하면 가물가물합니다. 정규표현식을 잘 하려면 아무래도 반복하는 수 밖에 없는데요. 어느정도 암기도 해야하지만 그럴 시간이 없죠. ▼ 그럴 때 유용하게 쓸 수 있는 정규표현식 치트 시트를 소개드립니다. 아래 표를 정규표현식을 쓸 때마다 반복적으로 보게 되면 어느 정도 암기도 잘 되고 더 빠르게 개발에 적용할 수 있는 것 같네요. ** 336x280 ** 2017. 8. 18.
phpmyadmin 용량 제한 해제 방법 phpmyadmin을 통해 DB를 다루다보면 csv나 sql 파일을 통해 데이터를 입력해야하는 경우가 있는데요. 일반적으로 파일 사이즈가 2MB가 넘어가면 용량 제한에 걸려 데이터 삽입이 안되는 경우가 있습니다. 이럴 때 phpmyadmin의 용량 제한을 해제하는 방법에 대해 알아보겠습니다. ▼ 우선 phpmyadmin 의 php.ini 파일을 찾으면 됩니다. 아파치 웹서버를 사용하고 있고 php 7.0을 쓰고 있다면 보통 /etc/php/7.0/apache2/php.ini 에 위치해 있습니다. vi 편집기 또는 다른 에디터를 통해 php.ini 파일을 엽니다. ▼ 수정해야할 부분은 2곳인데요. 우선 upload_max_filesize = 2M 부분에서 2M를 원하는 파일 사이즈로 수정합니다. 저는 그냥.. 2017. 8. 17.

티스토리툴바