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

---

인기순

• webdevetc 윈도우즈에서 특정 ip, 포트 외부 및 사내 접근 허용 방법, 방화벽 인바운드 설정하기 윈도우즈 환경에서 자신의 ip 주소를 외부 및 사내에서 접근하도록 ip 또는 포트를 허용하는 방법을 알아봅니다.# 윈도우즈 외부 접근 ip 및 포트 허용하기자신의 pc로 접근을 허용 가능하도록 하려면 방화벽 설정을 변경해야합니다. 보안상의 이유로 기본값은 외부의 접근이 막혀있으며 이때 인바운드 규칙을 변경 추

  View : 1179 / 2020-05-18
  
• etc 캡처 및 그리기 픽픽 다운로드 정보 및 알아보기 잘 알려진 어플리케이션 픽픽(picpick)에 대하여 자세히 알아봅니다.# 픽픽은? PicPick픽픽은 잘 알려진 무료 어플리케이션으로 화면 캡쳐(스크린샷) 및 이미지 편집툴입니다. 많은 사용자를 확보하

  View : 474 / 2020-05-18
  
• vuejs vue-cli-service 에러 - 외부 명령, 실행할 수 있는 프로그램, 또는 배치 파일이 아닙니다 VueJS를 사용하는 앱에서 vue-cli-service를 사용하여 앱을 구동할 때 다음과 같은 에러가 발생했습니다.'vue-cli-service'은(는) 내부 또는 외부 명령, 실행할 수 있는 프로그램, 또는 배치 파일이 아닙니다.문제의 원인은 무엇이고 어떻게 해결할 수 있는지 알아봅니다.! 어떤 상황에서 에러가 발생했을까?우선

  View : 3591 / 2020-05-18
• python [python]Jinja2의 타입 알아내는 방법은? 파이썬에서 템플릿 엔진 jinja2를 사용할 경우 현재 어떤 타입을 가지고 있는지 확인할 수 있을까요?결론부터 얘기하면 파이션 타입을 jinja2에서 확인할 수 있는 방법은 현재로는 없습니다. 매우 아쉬운 부분입니다.그 이유를 알아보면 jinja2 자체가 파이썬 언어가 아니므로 파이썬 언어의 모든 타입을 가지고 있지 않아 타입을 출력하는 내부 함수가 존재하지 않습니다.결

  View : 412 / 2020-05-17
• react React state값 변경, 업데이트 방법 React에서 데이터를 사용하고 추가 및 변경할 수 있는 state에 대하여 알아봅니다.# React state 알아보기컴포넌트에서 데이터를 선언하고 변경하기 위해 state를 사용합니다. state의 값을 변경하면 화면 뷰의 렌더링에도 함께 반영되게됩니다. 즉 <s

  View : 1337 / 2020-05-16
  
• vuejs VueJS transition 컴포넌트 배우기, 애니메이션 VueJS를 사용하여 CSS 트랜지션(CSS Transition) 효과를 사용할 수 있는 transition 컴포넌트에 대하여 알아보려고합니다.# Vue transition 컴포넌트란?프론트 화면을 개발할 때 애니메이션 효과를 많이 사용합니다. 이 경우 가장 많이 사용되는 방법이 바로 CSS를 사

  View : 921 / 2020-05-15
• python Python Jinja2에서 문자열 길이 구하고 출력하는 방법 Python에서 자주 사용되는 Jinja2 템플릿 엔진에서 문자열의 길이를 구하는 방법에 대하여 알아보려고 합니다.어떻게 하면 Jinja2에서 문자열 길이를 구하고 또 출력 할 수 있을까요?# Python jinja2에서 문자열 길이 구하기일단 방법부터 알아보면

  View : 646 / 2020-05-15
  
• html [HTML] 테이블 태그에서 colspan 최대 값 설정하기, table colspan HTML 테이블 태그를 사용하는 경우 만약 colspan 또는 rowspan의 최대값을 설정하는 방법에 대하여 알아봅니다.# HTML table 태그의 colspan 최대값 설정하기rowspan 역시 colspan 설정 방법과 동일하므로 colspan의 방법에 대하여 알아봅니다.!

  View : 1006 / 2020-05-11
• python [pymongo] 몽고db 임의의 document 선택 방법, random 파이썬 앱에서 pymongo를 사용하는 경우 만약 임의의 document를 랜덤하게 가져오려면 어떻게 하는지 알아봅니다.# pymongo 랜덤 document 선택, 가져오기먼저 방법을 생각해보면 아래와 같이 두 가지 방법이 있습니다.<span data-custom-style="ct

  View : 480 / 2020-05-11
• webdevetc [서버구축] 단일 서버와 데이터베이스 서버의 분리가 왜 필요할까 일반적으로 단일 서버로 운영하거나 아니면 데이터베이스 서버를 분리하여 사용하는 경우가 많습니다. 그렇다면 이 둘의 차이점은 무엇이고 언제 그리고 왜 이렇게 사용하는지 알아보려고 하니다.# 서버 구축시 단일 서버와 데이터베이스 서버 분리 방법의 차이는?일반적으로 단일 서버를 사용하는 경우... 즉 WAS 서버와 Database서버를 하

  View : 1877 / 2020-05-07
  
• linux 리눅스 명령어 history 알아보기 리눅스 명령어 중 하나인 history에 대하여 알아봅니다. history는 무엇이고 언제 사용할까요?# 리눅스 명령어 history 알아보기리눅스에서 history 커맨드는 자주 사용되는 명령어로 history를 입력하면 최근에 입

  View : 506 / 2020-05-06
• webdevetc 최근 개발자 채용시 내세우는 근무 환경과 혜택, 여건 등은 무엇이 있을까 회서에서 실력있는 개발자를 구하기는 결코 쉬운 일이 아닙니다. 최근에는 많은 회사들이 이런 저런 다양하고 독특한 장점들을 내세우고 있죠.아래는 최근 개발자의 채용공고를 살펴보면서 공통적이거나 특색있는 채용 조건 등을 알아보고자 합니다. 최근에는 어떤 근무형태, 근무환경 또는 복리후생 등

  View : 539 / 2020-05-06
  
• db [MongoDB] 몽고DB update() 기존 값 변경, 수정하기 MongoDB를 사용하는 경우 기존 값을 찾아 변경하는 방법 update()에 대하여 알아봅니다.# MongoDB, update() 알아보기먼저 값을 변경, 수정할 경우 update()를 사용합니다.db.Collection.up

  View : 1608 / 2020-04-30
• js [자바스크립트] 배열 메소드 entries() 알아보기 자바스크립트 배열 타입에 사용하는 entries() 메소드에 대하여 알아봅니다.# 자바스크립트 entries() 메소드 알아보기배열에 사용 가능한 다양한 메소드 들이 존재하죠. 그 중에 entries()</spa

  View : 677 / 2020-04-27
  
• css [scss] 다른 스타일을 가져와 적용하기, @extend 확장 CSS의 전처리기 언어인 SCSS를 사용하는 방법 중 다른 스타일을 가져오는 방법에 대하여 알아봅니다. 바로 @extend를 사용한 스타일 확장 방법입니다.# SCSS의 스타일 확장 알아보기, @extend전처리기 덕분에 CSS 역시 자바스크립트의 객체처럼 다른 스타일을 상속 받는 것처럼 사용하는 것이 가능합니다. 상속과는 다를

  View : 498 / 2020-04-27
• webdevetc [npm] node 패키지 모듈의 버전을 원하는 버전으로 변경하는 방법 아래는 노드 패키지 모듈(npm) 설치 할 때 원하는 버전을 선택, 설치(인스톨)하는 방법을 알아봅니다.# 노드 패키지 원하는 버전으로 설치하기패키지 모듈을 npm으로 설치시 반드시 최신 버전이 필요한 것은 아닙니다. 오히려 그 이하의 버전이 필요하기도합니다. 특히 모듈 사이의 <sp

  View : 1299 / 2020-04-21
• lodash [lodash] clonedeep 알아보기, 객체 복사 방법 lodash를 사용하여 자바스크립트의 객체를 복사하는 방법 중 딥클론(Deep cloning) 방법을 알아봅니다.# lodash를 사용하여 객체 복사하기, _cloneDeep()먼저 객체 타입을 복사하는 방법은 여러가지가 있습니다. 그 중 하나가 바로 <span d

  View : 1567 / 2020-04-20
  
• webdevetc 웹개발 소스를 크롬에서 바로 수정 및 저장 방법 알아보기 크롬 브라우저를 사용하여 개발자 도구를 사용해 직접 소스를 변경, 추가하는 방법에 대하여 알아봅니다.! 브라우저에서 직접 수정하고 추가하는 방법이 가능?크롬 브라우저를 사용하는 경우 크롬의 Workspace 설정으로 가능합니다. 그럼 개발자 도구를 사용하여 브라우저에서 직접 수정하고 저장하는 방법에 대하여 자세히 알아봅니다.# 개발자 도구로 크롬에서 바로 수정,

  View : 8060 / 2020-04-18
  
• js 자바스크립트 바닐라 JS의 의미, VanillaJS 자바스크립트에서 자주 등장하는(?) 바닐라JS(VanillaJS)에 대하여 알아봅니다. 바닐라JS는 무엇일까요? 뭘 의미할까요?# 바닐라JS란 무엇인가? VanillaJS우선 바닐라JS는 프레임워크나 라이브러리가 아닙니다. 하지만 그렇게 잘못 이해하기도 하는데 실제로 바닐라JS의 소스를 확인해보면 용량이 0byte로 내용이 없습니다. 다시 말해 <s

  View : 1719 / 2020-04-16
• git [Git] git remote repository 변경하는 방법 Git에서 리모트 저장소(remote repository)를 다른 주소 URL로 변경하고자 합니다. 예를들어 두 개의 git 리모트 저장소 있는 경우 한 쪽에서 다른 쪽으로 바꾸는 경우가 있겠죠.! 언제 리모트 저장소 변경이 필요한가새롭게 remote repository를 생성한 경우가 있을 수 있습니다. 예를들어 새로운 계정으로 repository를 생성했는데 앞으로는 이 계

  View : 4702 / 2020-04-14
• linux [Linux] 리눅스 명령어 rename 알아보기 리눅스 명령어 rename에 대하여 알아보겠습니다. 간단한 문법과 예제 사용 방법을 함께 알아봅니다.# 리눅스 명령어 rename리눅스에서 이름을 바꾸는 경우 rename을 사용할 수 있습니다. 참고로 리눅

  View : 1793 / 2020-04-14
  
• webdevetc 윈도우즈 시작프로그램 중지, 삭제하는 방법 윈도우즈에서 시작프로그램을 정리하는 방법을 알아봅니다. 여기서는 빠르게 시작 프로그램을 중지, 삭제하려면 어떻게 할 수 있는지 알아봅니다.! 시작프로그램 정리의 필요윈도우즈 등의 OS를 오래 사용하면 자신도 모르는 프로그램이 설치되기도 하고 이런 프로그램, 어플리케이션이 시작프로그램에도 등록되어 부팅되면 계속해서 실행될 수 있습니다. 이 중에는 거의 사용하지 않거나 사용되지 않

  View : 444 / 2020-04-14
  
• python [Python] 방문자 카운터 만들기 방법 및 예제 Python에서 방문자 카운터를 만드는 방법에 대하여 알아봅니다.! 방문자 카운터를 만들기 전에 생각할 부분먼저 어떻게 구현할까를 생각해야겠죠. 고민이 필요한 부분은 크게 두 가지 입니다.하나. 방문자 기준은 어떻게 세울 것인가?방문자를 측정하는 기준을 세션으로 정했습니다. 즉 세션이 늘어나면 방문자 수가

  View : 1034 / 2020-04-10
  
• css [CSS] 웹페이지 scroll 이동, 스크롤링 막는 다양한 방법 overflow 웹페이지 CSS를 사용하여 스크롤을 이동하지 않도록 막는 다양한 방법에 대하여 알아보려고 합니다. 특히 모바일 환경에서의 이슈도 함께 알아봅니다.# 웹사이트 스크롤을 이동하지 않도록 고정하기콘텐츠의 길이가 길면 상하 스크롤이 나타나겠죠. 만약 이런 스크롤이 안

  View : 4617 / 2020-03-31
  
• js [HTML5] 캔버스 영역을 자바스크립트를 사용하여 base64로 저장하기 HTML5의 캔버스(Canvas) 태그를 이미지로 만들어 저장하는 방법에 대하여 알아봅니다.# HTML5 캔버스(Canvas) 태그 이미지 및 파일로 저장하는 방법캔버스 태그를 사용하면 캔버스에 그려진 내용을 이미지나 파일로 저장할 수 있습니다. 이는 캔버스 API의 가장 강력한 기능 중 하나입니다. 이때 저장 방법은 아래와 이미지 파일과 ba

  View : 2462 / 2020-03-28
• react [react] className을 조건에 따라 여러개 다이나믹하게 선언하기 React 앱에서 클래스 이름을 조건에 따라 다이나믹하게 설정하는 방법을 알아봅니다. 어떻게 하면 될까요?# React 클래스 이름 선언하는 방법React는 다른 프레임워크는 문법이 많이 다른 편입니다. 특히 클래스 이름을 선언할 때 역시 방법이 조금 틀립니다. 그런

  View : 3369 / 2020-03-24
  
• js js 파일 압축하는 방법 및 es6 지원, uglify-js-es6 자바스크립트 파일을 압축해주는 uglifyjs 라이브러리는 꽤 유명합니다. 워낙 예전부터 유명한 자바스크립트 압축 유틸리티로 js 파일을 압축해 크기를 줄일 수 있는 방법이죠.! uglifsjs는?압축(Compress)으로 잘 알려져 있지만 Parcer, Minifier, <span data-custom-sty

  View : 1336 / 2020-03-23
• js [자바스크립트] 객체가 문자열인 경우 객체 또는 JSON 타입으로 변경하는 방법 자바스크립트의 객체가 만약 문자열인 경우를 생각해봅니다. 예를들어 input 태그에 문자열로 아래의 값이 저장된 경우를 생각해봅니다.'{ siteName: "webisfree" }'문자열이지만 원래는 객체임을 한 눈에 알 수 있습니다. 그렇다면 위 문자열을 다시 객체로 변환해보려고 합니다. 어

  View : 1301 / 2020-03-23
  
• js [자바스크립트] requestAnimationFrame()을 사용하는 방법 및 예제 자바스크립트의 내장함수인 requestAnimationFrame()에 대하여 알아봅니다.# 자바스크립트 requestAnimationFrame() 메소드 알아보기자바스크립트에서 애니메이션을 구현하는 방법으로 new Date()를 사용한 타이머

  View : 2856 / 2020-03-19
  
• js 자바스크립트 소수점 이하의 값만 구하는 방법 자바스크립트를 사용하여 소수점 이하의 값만 구하는 방법에 대하여 알아봅니다.# 자바스크립트 소수점 이하의 값만 얻는 방법정수가 아닌 실수의 숫자 값 중 소수점 이하의 값을 구하려고 합니다. 예를들어 10.234라는 숫자가 있다면 0.234의 값만 얻고 싶습니다. 이때 사용 가능한 방법이 바로 <span data-custo

  View : 2178 / 2020-03-19