5 페이지 - 웹개발 커뮤니티 블로그

webdevetcGit사용시 gitignore 동기화 무시하는 방법 Git을 사용하여 개발, 배포등의 프로세스를 사용할 경우 동기화, 즉 서버에 반영하지 말하야 할 파일이나 폴더가 존재합니다. 예를들면 방문자에 의해 바뀌는 파일 업로드나 아니면 개발자 각각의 설정 파일 등이 그런 것들입니다.그렇다면 이런 파일을 서버와 동기화하지 않고 추가하지 않는 방법은 어떻게할까요? 이때 .gitignore를 사용하면 되는데요 아래에서 알아봅니다.<b

View : 710 / Created : 2019-07-31

pythonPython flask에서 디버깅(debug), 중단점(breakpoint) 사용 방법 Flask를 사용하여 Python을 구동하는 경우 디버깅(Debugging)을 목적으로 중단점(breakpoint)을 설정하여 사용하고 싶다면 어떻게 해야하는지 알아봅니다.! breakpoint(중단점)브라우

View : 1740 / Created : 2019-07-29

webdevetc파비콘이 없는 경우 에러 방지, prevent favicon error 웹페이지에 파비콘이 없거나 아직 준비되지 않은 경우 브라우저에서 에러가 발생할 수 있습니다. 에러 메시지는 파비콘이 존재하지 않는다는 메시지입니다.# 파비콘 에러 메시지 무시하기만약 파비콘을 사용할 계획이 없거나 에러 메시지를 무시하려면 어떻게 할까요? 이 때는 아래와 같이 파비콘 관련 설정을 <head> 태그에 추가하면 에러는 사라지게 됩니다.<link rel="s

View : 661 / Created : 2019-07-29

css[CSS] 선택자 :focus-within 알아보기 CSS 선택자 :focus-within에 대하여 알아봅니다. 언제 어떻게 사용할까요?# CSS 선택자 :focus-widthinCSS 선택자 중 :focus-within이 존재합니다. :focus-within은 폼 엘리먼트에 사용하며 방문자의 포커스된 엘리먼트에 스타일을 부여할 수 있는 매우 유용한 선택자입니다. 특징으로는 부모 요소에 사용하면 내부

View : 1425 / Created : 2019-07-26

js자바스크립트에서 URL 쿼리스트링(query string) 쉽게 가져오는 방법 웹페이지에서 url/uri를 통해서 전달된 쿼리스트링 정보를 자바스크립트에서 읽어오는 방법에 대하여 알아봅니다.# 쿼리스트링 정보 자바스크립트 읽어오는 방법웹페이지로 정보를 전달하고 이를 읽어오는 방법으로 쿼리스트링(query string)을 통해 전달할 수 있습니다. 이렇게 전달된 경우 아래와 같은 형태의 url 주소를 가지고 있겠죠.<div class

View : 4065 / Created : 2019-07-26

html[html] base 태그 사용 방법 알아보기 웹페이지 HTML에 사용되는 <base> 태그에 대하여 알아봅니다.# HTML base 태그는?base 태그는 head 안에서 선언된 것을 볼 수 있는데요 ~ base 태그를 사용하면 기준이 되는 base url/uri를 설정하여 사용할 수 있습니다.

View : 1799 / Created : 2019-07-22

jquery제이쿼리 다음 엘리먼트 찾기 next() nextAll() 제이쿼리 선택자는 매우 편리한데요~ 만약 어떤 엘리먼트를 선택자로 찾았는데 그 다음에 위치한 엘리먼트를 가져오는 방법을 알아볼까합니다.# 제이쿼리를 사용하여 다음 엘리먼트 가져오기제이쿼리는 다음에 위치한 엘리먼트(형제 엘리먼트 중 다음이죠)를 가져올 수 있도록 아래와 같이 두 개의 메소드를 제공합

View : 1239 / Created : 2019-07-21

vuejs[VueJS] 태그 이름 무시, vue 컴포넌트 제외하는 방법 VueJS에서 컴포넌트가 아닌 태그를 사용할 경우 에러가 발생합니다. 어떻게 하면 에러가 나타나지 않을까요?예를들어 <myTag></myTag>라는 태그를 웹페이지에 코드에 추가한다고 가정해봅니다.<div id="vueApp"> <myTag>Hi</myTag></div>VueJS에서는 myTag가 Vue에 등록된 태그라고 인식하고 찾기 시작할텐데

View : 488 / Created : 2019-07-21

etc넷플릭스(Netflix) 요금제 및 기타 정보 인기 영화 및 드라마 등을 볼 수 있는 가장 유명한 스트리밍 사이트 중 하나, 넷플릭스(Netflix)에 대한 가격 및 기타 정보들입니다. - 회사명 : 넷플릭스- 홈페이지 : <a href="https://www.netflix.com/kr/" target="_b

View : 1056 / Created : 2019-07-20

cssCSS display grid 방법 및 예제 보기 css를 사용하여 화면 그리드(grid) 레이아웃을 구현하는 가장 간단한 방법은 display: grid 또는 display: inline-grid를 사용하는 것입니다. 아래와 같이 css를 선언하여 사용합니다.display: grid | inline-gridgrid는 격자를 의미하는데 css그리드 형태의 레이아웃을 구현할 때 이 방법을 사용하면 매우

View : 2607 / Created : 2019-07-18

webdevetc애드센스 광고에서 ads.txt 파일 생성 및 추가하는 방법 구글 애드센스(Adsense)를 사용하는 경우 ads.txt 파일을 생성하여 자신의 웹사이트에 적용하는 방법을 알아봅니다.구글 애드센스는 ads.txt 파일을 서버에 추가하여 사용할 것을 권장하고 있는데 하지만 ads.txt가 실제 광고 수익에 얼만큼 큰 영향을 미치는지는 알 수 없는 것 같습니다. 다만 향후에는 대부분의 사이트에서 ads.txt를 사용해야만 하는 상황이 올 것이라 예상할

View : 1144 / Created : 2019-07-16

js자바스크립트 객체 병합, 합치는 방법, merge 자바스크립트에서 여러개의 객체를 하나로 병합하는 방법... 즉, 객체(Object)를 합치는 방법(Merging)에 대하여 알아보겠습니다.! 객체를 언제 합쳐야 할까요?여러가지 이유가 있겠지만 가장 많은 이유는 컬렉션 등의 데이터를 가지

View : 5640 / Created : 2019-07-09

cssCSS filter 프로퍼티 사용하여 블러 효과 적용하기, blur CSS의 filter 프로퍼티를 사용하여 블러 효과(Blur effect)를 적용하는 방법에 대하여 알아봅니다. CSS의 filter는 CSS3에서 지원된 프로퍼티로 특정 이미지나 요소에 적용하면 다양한 필터 효과를 적

View : 4255 / Created : 2019-07-09

js제이쿼리 not() 메소드 알아보기 제이쿼리(jQuery)에서 선택자 결과에 사용 가능한 not() 메소드에 대하여 알아봅니다. 어떻게 그리고 언제 사용할 수 있을까요? # 제이쿼리 not() 메소드 알아보기먼저 엘리먼트를 선택하기 위해서 선택자(selector)를 사용합니다. 이때 $(s

View : 1432 / Created : 2019-07-06

js자바스크립트에서 AJAX 비동기 방식으로 Excel 파일 다운로드 받는 방법 자바스크립트를 사용하여 비동기 AJAX를 사용하여 엑셀(Excel) 다운로드 받는 방법을 알아봅니다. 먼저 아래의 상황에서 ajax 다운로드를 수행하게 됩니다.- AJAX로 서버에 값을 전송- 전송된 값에 따라 엑셀(blob) 타입으로 서버에서 엑셀 파일을 리턴- 전달 받은 response를 다운로드 링크를 만들어서 클릭 이벤트를 실행

View : 6686 / Created : 2019-07-02

js[자바스크립트] ]Select 태그의 값의 value 프로퍼티 변경시 onchange가 동작 안 하는 경우 해결하기 자바스크립트에서 select 태그에 onchange 이벤트를 사용할 수 있습니다. 그런데 onchange 이벤트가 동작하지 않는 경우가 발생할 수 있는데요... 그 원인과 해결방법을 알아봅니다.onchange가 select 태그에 바로 동작하지 않는 경우는 select 태그를 클릭해서 값을 선택하지 않고 select 태그의 value 프로퍼티의 값을 스크립트를 사용하

View : 1583 / Created : 2019-07-01

js자바스크립트 FormData 데이터 전송 알아보기 자바스크립트에서 서버에 데이터를 전달해주는 API(인터페이스) FormData에 대하여 알아보겠습니다.! FormData는 무엇인가?자바스크립트를 사용하여 데이터를 서버에 보낼 수 있으며 Ajax 방식, 비동기식으로 데이터나 파일 모두 전송 가능하다는 점이 장점입니다. 최근 FormData가 많이 사용되는 이유는 비동기식 통신으로 <form&

View : 4051 / Created : 2019-06-27

webdevetcbootstrap DataTable 사용시 sorting 정렬하는 방법 부트스트랩(Bootstrap)의 DataTable을 사용하는 경우 테이블 정렬, sorting 방법입니다. (참고로 데이터테이블은 ajax를 사용하여 불러온 데이터를 기반으로 손쉽게 테이블 UI를 그려주는 라이브러리, 툴입니다.)# DataTable 정렬하는 방법DataTable의 정렬은 설정에

View : 3462 / Created : 2019-06-21

webdevetccurl 411 에러, Length Required 해결하기 curl을 사용하여 서버와 통신하는 경우 아래와 같은 메시지와 에러가 발생할 수 있습니다.<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN""http://www.w3.org/TR/html4/strict.dtd"><HTML><HEAD><TITLE>Length Required</TITLE><META HTTP-EQUIV="Content-Type" Content="text/html;

View : 1487 / Created : 2019-06-19

js자바스크립트 Object 메소드 entries() 알아보기 자바스크립트의 객체(Object)에 사용할 수 있는 entries() 메소드에 대하여 알아봅니다.# 자바스크립트 Object의 entries() 메소드는?자바스크립트은 여러 타입이 있는데요 그 중에 객체 타입은 배열처럼 여러 개의 값을 가지고 있습니다. 만약 객체가 어떤 값들을 가지고 있는지 모두

View : 1715 / Created : 2019-06-18

cssCSS 레인보우(rainbow) 색상의 텍스트 만들기 CSS를 사용하여 텍스트에 특별한 효과를 만들 수 있습니다. 이번에는 무지개 효과를 만드는 방법에 대하여 알아봅니다. 어떻게 하면 무지개 효과를 만들 수 있을까요? 아래에서 확인해보세요. # CSS 텍스트 무지개 효과 구현하기텍스트를 강조하는 방법으로

View : 1574 / Created : 2019-06-18

webdevetcdateTimePicker UI 사용시 동적으로 날짜 format 변경하는 방법 날짜 시간을 입력 받을 수 있는 라이브러리 datetimepicker UI는 시간과 날짜를 함께 설정할 수 있는 편리한 UI 컴포넌트로 매우 자주 사용됩니다. 아래는 datetimepicker의 날짜 시간 포맷을 동적으로 변경하는 방법에 대하여 알아보겠습니다.만약 상황에 따라 사용할 날짜/시간 포맷을 동적(dynamic)으로 변경하려면 어떻게 해야할까요? 페이지 로딩시 설정

View : 2286 / Created : 2019-06-14

webdevetcnginx 국가 코드별 접속 차단 및 허용 설정하기 원치 않는 국가에서 접근을 시도하는 경우 어떻게 하면 접속을 막거나 허용할 수 있는지 고민하게 되었습니다. 이유는 몇 가지 있는데 최근 급증한 데이터 트래픽 증가가 원인 중 하나였습니다.어쨌든 방문자의 접속을 제어하고 싶은데 어디서 제어할 것인가를 결정해야 합니다. 이 중에서 간단한 방법인 서버측 환경, nginx 설정을 사용하여 국가 별로 허용하거나 제한하는 방

View : 1308 / Created : 2019-06-07

js[자바스크립트] input 태그 placeholder 프로퍼티 자바스크립트를 사용하여 input 태그의 placeholder 값을 가져오거나 변경 가능한 프로퍼티 placeholder에 대하여 알아봅니다.placeholder자바스크립트 프로퍼티 placeholder는 input 태그에 사용하여 적용된 placeholder의 값을 변경하거나 가져올

View : 1596 / Created : 2019-06-04

js자바스크립트 객체를 쿼리스트링 값으로 바꾸기 자바스크립트를 사용하여 API를 호출하는 경우 서버에 값을 전달해야 하는 경우가 있죠. 이때 객체로 된 값을 쿼리스트링(QueryString)으로 변환하려면 어떻게 해야하는지 알아봅니다.# 객체로 된 값을 쿼리스트링(query string) 값으로 변환하기서버에서는 encoded 값으로 문자열로

View : 1063 / Created : 2019-05-15

js자바스크립트 fetch API 알아보기 자바스크립트를 사용하여 AJAX 비동기 통신을 위해 별도의 라이브러리를 많이 사용하고 있습니다. 예를들면 jQuery의 ajax() 메소드를 사용하거나 아니면 axios 라이브러리 등을 단지 AJAX 구현을 위한 목적으로 추가해 사용해왔습니다.왜냐하면 <

View : 7832 / Created : 2019-05-15

pythonPython pip 설치 후 package 버전 확인 방법 python에서 pip를 사용하여 패키지를 설치하여 사용하는 경우 현재 버전을 확인하는 방법을 알아봅니다. 아래의 show 플래그는 특정 패키지의 여러 가지 정보를 출력합니다.pip show <packageName>그럼 예를들어 어떻게 출력되는지 아래에서 확인해보세요.# pip 설치된 패키지 정보 알아보기설치된 패키지 pym

View : 5039 / Created : 2019-04-16

pythonPython Jinja2에서 소문자 대문자 사용하는 방법 Python에서 Jinja2를 사용할 때 텍스트를 소문자 또는 대문자로 변환, 바꾸는 방법을 알아봅니다. 어떻게 하면 될까요?# Jinja2 템플릿 소문자 대문자 변환하는 방법대문자 소문자 변환은

View : 452 / Created : 2019-04-11

vuejsVueJS 부모 자식 컴포넌트에 props 사용하여 양방향 바인드 방법 VueJS에서 부모와 자식 컴포넌트 사이에 데이터를 서로 주고 받는 양방향 바인딩(Two way binding) 방법에 대하여 알아봅니다.먼저 컴포넌트 사이의 데이터를 주고 받는 방법은 여러가지가 있습니다. 전역 데이터를 사용하거나, 이벤트버스(EventBus), <span dat

View : 5282 / Created : 2019-04-04

webdevetc네이버블로그 본문에 광고를 노출하자. 네이버애드포스트 본문에 광고 개제하기 네이버블로그를 운영해오던 많이 이들에게 드디어 반가운 소식이 들려오게 되었습니다. 바로 네이버블로그의 본문에 광고 게재가 된다는 사실입니다!!"네이버블로그 본문에 광고 게재되다."아마 많은 분들이 궁금해왔던 부분인데요... 네이버는 블로썸 데이에서 현재의 네이버블로그에 대하여 여러가지 개편 및 개선될 사항들을 미리 얘기

View : 1271 / Created : 2019-03-29

CATEGORIES

LATEST POSTs 가장 최근에 등록된 포스팅 목록입니다.