LATEST POSTs 최근 등록된 포스팅 목록 최신순

---

인기순

• webdevetc 아마존 웹서버 AWS 가격 정책 알아보기 아마존 웹서버 AWS 가격 정책에 대한 정보입니다.아마존 웹서비스인 AWS는 사용한 만큼 비용이 발생하는 방식의 요금제입니다. 사용된 Gbyte, 기가 바이트에 요금이 책정되거나 사용 시간당 요금이 과금됩니다. 이런 요금 방식은 불필요한 리소스를 최대한 줄일 수 있어 매월 일정한 트래픽이 발생하는 기업에게 가장 효과적입니다. 그럼 아래는 가장 많이 사용되는 EC2 그리고 S3의 가격 정보입니다.<

  View : 2099 / 2017-05-18
• webdevetc [실전] 검색창 UI 만들기 웹퍼블리싱 배우기. 이번에는 키워드를 찾아 검색할 수 있는 기능을 웹에 추가하기 위하여 검색창을 만드는 방법을 알아보겠습니다.# 검색창은 무엇이고 언제 사용되나요검색창은 방문자에게 원하는 웹사이트의 콘텐츠를 좀 더 찾기 쉽도록 도와주는 역할을 합니다. 예를 들어 css에 관련된 블로그 글을 찾는 경우 간단하게 검색창에 css를 타이핑하여 검색결과

  View : 22151 / 2017-05-18
• webdevetc 파이어폭스 다운로드 및 설치하기 모질라의 가장 잘 알려진 브라우저 Firefox(파이어폭스)의 정보 및 다운로드에 대하여 알아보겠습니다.# 파이어폭스 브라우저파이어폭스는 데스크탑과 모바일 버전으로 나누어집니다. 다운 받기 위해서는 아래의 링크에서 가능합

  View : 2127 / 2017-05-16
  
• webdevetc 웹개발에서 병렬처리가 의미하는 것은? 웹개발에서 사용되는 용어 병렬처리에 대하여 간단히 알아보겠습니다. 개발관련 글이나 대화를 통해 병렬처리가 되지 않는다~ 또는 병렬처리를 위해 필요하다는 말을 듣거나 읽게 됩니다. 여기서 병렬처리는 무엇을 의미할까요? 서버에서 바라봤을때 하나의 요청이 있는 경우 이에 대하여 하나의 응답을 하게 될 것입니다. 그런데 만약 하나가 아닌 여러 요청이 있는 경우라면 어떨까요?

  View : 930 / 2017-05-14
• webdevetc 자바스크립트 라이브러리 Lodash와 underscore 알아보기 자바스크립트 인기 라이브러리 중 하나인 Lodash와 underscore 알아보려합니다.소스 코드를 보면 _.test() 처럼 _로 시작하는 코드를 볼 수 있습니다. 이 코드는 위 라이브러리 소스로 자주 사용되는 라이브러리 툴입니다. 위 두 라이브러리 모두 자바스크립

  View : 5331 / 2017-05-12
• webdevetc 웹개발에 도움이 되는 블로그, 웹사이트, 채널 정보 웹개발(Web Development)을 잘 하기 위해서 도움이 되는 블로그나 웹사이트, 채널들을 알아두면 좋겠죠. 그럼 어떤 채널, 사이트가 있을까요? 아래에서 알아보도록 하겠습니다.# 웹개발과 관련된 유용한 사이트 알아보기웹 관련 종사자를 비롯해 많은 사람들이 웹개발을 찾습니다. 관력 서적도 좋지만 요즘은 방대한 개발 정보를 접하는데 다양한 채널과 사이트가 많이 존재하죠. 그럼 이런 사이트 중에서도 특히 인기있는 ~ 잘 알려진

  View : 2702 / 2017-05-12
• webdevetc SSH를 사용한 서버 접속 방법 서버에 접속하기 위한 방법으로 SSH(Secure Socket Shell)를 사용하여 접속하는 방법입니다.많이 사용되는 방법으로 putty를 사용하는 방법과 ssh 명령어를 사용하는 방법 두 가지가 사용됩니다. 각각 아래의 링크에서 자세히 확인하실 수 있습니다.Putty를 사용한 SSH 접속 방법 >https://web

  View : 1458 / 2017-05-11
• webdevetc Windows 10에서 Linux bash shell 사용하는 방법 Windows 10에서 Linux Bash Shell을 사용할 수 있다는 사실!! 알고계신가요? 아래는 윈도우즈10에서 Bash shell을 사용하여 리눅스를 사용하는 방법에 대하여 매우 상세하게 ~ 알아보고자 합니다!!# 윈도우즈 10에서 Linux bash shell 사용방법 알아보기먼저 윈도우즈 10에서는 우분투(Ubuntu bash

  View : 26780 / 2017-05-10
  
• webdevetc 특수문자를 제외하고 검색하는 정규표현식 방법 만약 특수문자를 제외하고 검색하는 정규표현식 방법은 어떻게 될까요? 아래에서 자세히 알아봅니다.예를들어 새로운 가입자의 아이디 또는 닉네임등을 입력받으려면 특수문자를 제외해야합니다. 이 경우 특수문자를 제외하는 방법으로 한글, 영문, 숫자 또는 공백만 허용하면 될 것 입니다. 그럼 정규표현식에서 공백, 문자, 숫자만 입력된 경우에만 검색하

  View : 13545 / 2017-05-03
• webdevetc Internal Server error, 서버 500 에러는 어떤 경우에 발생하나요? 웹서버를 구동하거나 사이트를 방문하면 다음과 같은 에러 메시지를 가끔씩 볼 수 있습니다.'500 Server error'간단하게 이해하면 서버 에러가 발생했다는 것을 알 수 입니다. 그런데 앞에 있는 500이라는 숫자는 무엇일까요? 그리고 어떤 의미가 있을까요? 아래는 이처럼 서버에서 발생 가능한 에러를 간략하게 정리한 내용입니다.<

  View : 236135 / 2017-04-27
• webdevetc svg 그리고 canvas 장단점 나열하기 svg 그리고 canvas의 장단점을 알아보려고 합니다. 제목의 범위가 너무 광범위한 것 같아 좀 더 범위를 좁혀 보자면... 웹개발이 필요한 경우 웹프론트 입장에서 svg, canvas 둘 중 하나를 사용해야 할 경우 어떤 방식을 사용하는게 좀 더 나은 선택일까요?웹퍼블리셔 및 프론트엔드 입장에서 생각해보겠습니다. 일반적인 경우 이미지 및 svg를 사용하는 것이 더 편한 방법일 것 입니다. 이유야 많겠지만 이미지나 svg 포맷은 여러 시각화 툴에서 쉽게 사용하고 다운로드 받을 수 있다는 점도 큰 이유입니다. 사실 생

  View : 1164 / 2017-04-27
• webdevetc Notepad++에서 한글 인코딩을 변환, 저장하는 방법은? Notepad++에서 한글 인코딩을 변환, 저장하는 방법은 무엇일까요?! Notepad+만약 Notepad++에서 불러온 문서의 한글이 정상적으로 보이지 않는 경우가 이에 해당합니다.@ 원인은? html과 에디터의 인코딩 방식에 차이가 날 경우 문제가 나타날 수 있어 문서의 인코딩 수정으로 해결될 수 있습니다.Notepad++에서 <b

  View : 6410 / 2017-04-09
  
• webdevetc HTML에서 한글 깨짐 문제 또는 현상을 해결하는 방법은? 한글이 깨져서 나타나는 문제를 알아보려고 합니다. 만약 html을 작성하는 에디터에는 아무 이상없이 한글이 잘 보이나 웹브라우저에는 한글이 깨져보이는 경우 어떻게 해결이 가능할까요?# 한글 깨짐현상이 브라우저에 나타나는 경우이 경우 가장 먼저 의심할 부분이 바로 html의 meta 영역에 선언된 한글 인코딩입니다. 만약 한글을 출력하는데 필요한 인코딩 설정이 잘못되었거나 되어 있지 않는 경우 한글 깨짐이 나

  View : 40609 / 2017-04-09
• webdevetc uib 드랍다운 부트스트랩에서 메뉴 선택시 메뉴가 닫히지 않는 경우 부트스트랩(UI Bootstrap)을 사용하여 드랍다운(Dropdown) 박스 형태의 인터페이스를 구현한 뒤 메뉴를 선택할 경우 드랍다운 메뉴가 닫혀야하나 닫히지 않는 경우가 발생할 수 있습니다.이 문제는 ng-click이 설정된 경우 드랍다운 메뉴를 컨트롤하는 이벤트 보다 먼저 실행되어 나타나는 이슈로 이를 해결하기 위한 방법으로 아래와 같은 방법이 존재합니다.# dropdown

  View : 1909 / 2017-02-22
• webdevetc Git에 commit 메시지를 다시 수정하는 방법 git을 사용하여 이미 커밋한 메시지를 다시 수정하는 방법에 대하여 알아봅니다.Git에 작업된 내용을 저장소에 업데이트하기 위한 과정중에 하나로 커밋(commit)을 수행합니다. 커밋은 리모트 저장소에 올리기 위한 push 이전의 작업으로 커밋을 할때는 보통 진행한 작업내용에 대한 간단하게 메시지 형태로 함께 작성하는데요...<

  View : 27890 / 2017-02-15
  
• webdevetc 웹소켓을 사용하기 이전의 채팅 구현 채팅 프로그램을 웹을 사용하여 구현하려면 html5의 웹소켓(websocket)이 먼저 떠오를 것이다. 웹소켓을 사용하여 브라우저를 통한 TC

  View : 3621 / 2017-02-10
• webdevetc 리스트의 순서를 변경하는 효과적인 데이터베이스 설계 방법 Webisfree에는 다양한 메뉴가 존재하고 있다. 간단하게 HTML, CSS, Javascript 마지막으로 PHP의 카테고리가 존재한다고 생각해보자.이 메뉴들이 보여지는 순서를 만약 관리자가 직접 변경하는 것이 가능하다면? 또한 이렇게 구현하기 위한 방법으로 데이터베이스의 구조에 대하여 어떤 설계가 필요할지 논의해보고자 한다. 예를들어 ... 아래의 A는 B가 되고 싶다

  View : 6207 / 2017-02-01
  
• webdevetc if문 등의 조건문을 줄바꿈 처리하는 방법 자바스크립트를 비롯해 프로그래밍 언어에서의 조건문 사용은 그 비중이 매우 높다. 조건이 다양해 질수록 해당하는 조건문의 길이가 길어지게 되는데 길어진 조건문은 각각의 조건들을 이해하기가 힘들어 가독성이 떨어지고 유지보수도 어려울 것이다.이런 문제를 해결하기 위해서는 각각의 조건들을 줄바꿈하여 나타내야하는데 그 방법이 다양할 수 있으며 각자 장단점이 있을 것이다. 아래는 다양한 방법의 조건식을 줄바꿈한 예들이다.! 조건문 보기좋게 줄바꿈하는 방

  View : 6479 / 2017-01-03
• webdevetc git 리모트 및 브랜치 삭제 추가 제거 업데이트 방법 Git을 사용한 형상관리방법으로 프로젝트를 진행할 경우가 대다수이죠. 아래는 일반적으로 마스터에 대하여 브랜치를 생성하거나 이미 생성된 브랜치를 삭제하는 등등의 방법에 대하여 알아봅니다.만약 프로젝트로 다수의 인원이 작업을 진행하는 경우 리모트의 마스터 브랜치를 기준으로 각자 로컬 브랜치를 생성합니다. 업데이트를 리모트에 업데이트하는 과정인 PR, <sp

  View : 9348 / 2016-12-26
  
• webdevetc git과 github 형상관리에 대하여 이해하기 형상관리 버전관리에서 가장 우수하다고 생각되는 git과 github을 정리해보았다. git을 이해하고 git의 특징 및 장단점에 대하여 알아보고자 한다.# git이란?간단하게 git이 무엇이냐면 VCS(Version Control System)에 D를 더한 Distributed VCS라 말한다. 이는 분산버전관리로 다수의 사람들과 공통의 프로젝트를 진행할때 효과적으로 협업할 수 있는 도구이다. 여기서 D가 붙은 것이 Git의 큰

  View : 8157 / 2016-12-16
• webdevetc 프론트엔드 개발 영역의 변화 웹은 빠르게 변화한다. 그리고 그 웹을 개발하는 웹 개발자의 포지션도 함께 빠르게 변화해간다...  아래 글은 최근 프론트엔드 개발 영역의 변화를 과거 그리고 현재와 비교하여 짧게 정리한 내용이다.프론트엔드, 앞단 영역을 다루던 코더가 점점 전문화 되면서 웹퍼블리싱 및 웹퍼블리셔라는 용어가 사용되기 시작했다. 이 영역이 점점 확고해졌고 좀 더 복잡한 웹사이트를 구현하기 위해 액션스크립트 및 자바스크립트 사용이 늘어가면서 이 분야만 담당하게 된

  View : 3244 / 2016-12-09
• webdevetc 반응형웹 구축시 css calc() 활용팁 반응형웹은 이제 모든 웹페이지의 필수가 되어버린 것 같다... 최근 접하는 프로젝트의 거의 모든 웹페이지에서 사용되고 있기 때문이다.  부트스트랩이나 기타 반응형웹을 쉽게 구현 가능하도록 돕는 라이브러리등을 사용한다면 크게 고민하지 않을 수도 있지만 필자는 항상 어떻게 레이아웃을 잡을 것인지부터 매우 많은 부분들에

  View : 27141 / 2016-08-05
  
• webdevetc 네이버맵 api v3 알아보기 네이버에서 새로운 지도 api를 공개하였습니다. 바로 NAVER MAP API V3 !! 이전 버전과 비교해 무엇이 달라졌을까요? 그리고 아직 맵 api를 모르시는 분들을 위해서 우선 간략하게 지도 API가 어떤 것인지 알려드리도록 하겠습니다. 그럼 먼저 지도 API에 대하여 알아보도록 하겠습니다.! 지도 api는

  View : 3952 / 2016-06-23
  
• webdevetc 웹퍼블리싱 인터뷰 예상질문 웹퍼블리싱(웹퍼블리셔)으로 이직 또는 취업을 준비하는 사람이라면 실무 면접과 면접 전 테스트 등이 있을 수 있다. 과연 퍼블리싱 분야에 지원하기 위해서는 어떤 준비를 해야할까? 또한 취업까지는 어떤 과정이 있는지 알아보고자 한다.기본적으로 웹퍼블리셔 또는 프론트엔드 개발자에게 요구하는 역량은

  View : 14032 / 2016-05-31
  
• webdevetc 차트 라이브러리 Am Chart 요즘은 대부분 플러그인, 컴포넌트 단위로 구현되기 때문에 웹페이지를 신규 런칭하는 경우도 예외는 아닐 것이다. 물론 모든 것을 처음부터 끝까지 개발자가 구현할 수도 있겠지만 시간과 비용을 고려했을 때 더 효과적인 방법이 구매하는 방법 또는 오픈 소스, api 활용이라면 그 방법도 고려하는 것이 좋지 않을까라고 개인적으로 생각한다.아래는 자바스크립트를 사용해 차트를 그릴 수 있는 AM CHA

  View : 8026 / 2016-05-03
  
• webdevetc WCAG 2.0 무엇이고 왜 알아야만 하는가? 웹사이트 구축시 웹퍼블리싱 단계에서 웹접근성에 대하여 고려해야 한다. 이때 WCAG라는 용어를 자주 볼 수 있는데 무엇을 뜻하고 의미하는지 이에 대하여 자세히 알아보자.! WCAG란 무엇인가?WCAG는 Web Content Accessibility Guidelines의 약어이다. WCAG는 바로 웹표준

  View : 2292 / 2016-04-28
  
• webdevetc 자바스크립트를 배우는 순서는 어떻게 해야할까 프론트엔드 개발자에게 자바스크립트가 필수라고 말하지만 사실 서버 개발자도 자바스크립트를 모르는 사람은 거의 없는 것 같다. 그 만큼 자바스크립트 언어 자체가 활용성이 높으며 많은 레퍼런스를 가지고 있기 때문일 것이다.숙련된 개발자에게 자바스크립트는 또 다른 언어로 요역하겠지만 개발자의 길을 새롭게 시작하는 이에게 자바스크립트는 큰 산과 같을 수 있을 것이다. 어떻게해야 이 높은 산을 정복할 수 있을지 난감할 이에게 조금이나마 알려주고자 이 글을 적어본다. 물론 이미 알고 있는 내용이거나 재미가 없을 수 있다. 반대의

  View : 4318 / 2016-04-26
  
• webdevetc 객체지향언어에서 인스턴스(instance)란 무엇인가 객체지향언어를 배우게 되면 가장 먼저 접하게 되는 것이 바로 객체와 인스턴스(instance)입니다. 여기서는 인스턴스가 무엇이고 어떻게 생성되는지 알아보고 왜 인스턴스가 중요한지도 함께 알아보도록 하겠습니다. 먼저 인스턴스는 무엇일까요? <span data-custom-

  View : 15680 / 2016-04-20
  
• webdevetc ie 8 embed 태그 youtube 동영상 재생이 안되는 경우 embed 태그를 사용하여 유투브(Youtube) 영상을 콘텐츠에 삽입하는 경우 IE 8 에서 정상적으로 동작하지 않을 수 있다. 이 경우 어떻게 해야 정상적으로 IE 8 구버전에서 플레이가 가능한지 알아보고자 한다.먼저 embed 태그가 IE 8 에서 지원하지 않는 것 같다... 이를 해결하기 위해 아래와 같이 해당 태그를 다른 태그로 변경하면서 테스트를 실시하였다. 실시 환경은 Windows 7 IE 8 브라우저이다.<

  View : 6321 / 2016-04-04
• webdevetc IE 8 에서 CSS 미디어 쿼리 적용 안되는 경우 해결하는 방법 CSS의 미디어 쿼리(Media Query)는 IE 구버전에서 정상적으로 동작하지 않는다. 만약 IE 8 에서 미디어 쿼리를 사용하려면 어떻게 해야할까? 사실 가장 좋은 방법은 IE 8을 지원하지 않는 방법이다. 그 이유는 간단한데 더 이상 MS에서 Support하지 않기 때문에 보안 이슈가 발생할 수 있기 때문이다...어쨌든 이를 해결하기 위한 좋은 대안이 있는데 이는 바로 Google에서 제공하는 오픈소스를 활용하는 방법이다.이 방법

  View : 3997 / 2016-04-01