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

---

인기순

• tech 네이버 검색페이지 화면 UI 개편되다 어제 2020년 10월 29일부터 PC 화면의 네이버의 검색 UI가 새롭게 개편되었습니다! 새롭게 바뀐 네이버 검색 화면은 어떤가 간략하게 알아봤습니다.# 새로워진 네이버 검색 화면 UI네이버 PC 화면의 검색 결과 화면 UI가 바뀌는 사실을 모르는 분들도 많았기 때문에 처음 접하는 경우 놀라는 경우도 많았습니다. 당일 시점에는 변경된 화면이 어색하다는 의견도 있더군요.<span data-custo

  View : 519 / 2020-10-30
  
• js 자바스크립트에서 URLSearchParams 사용하여 주소 쿼리스트링, 파라미터 변경하기 자바스크립트에서 주소 입력창에 입력된 파라미터 값을 다른 값으로 변경하는 방법을 알아봅니다.# 주소창의 현재 파라미터를 다른 값으로 바꾸기쉽게 말해 현재 아래와 같은 페이지값의 파라미터를 다른 값으로 바꾸는 방법이라고 생각하시면 됩니다.// 변경 전https://webi

  View : 2056 / 2020-10-30
  
• game 월광보합과 시작된 추억의 소환 잘 기억나지 않은 아주 오래 전... 처음 인터넷을 시작한 계기는 바로 에뮬레이터였습니다.90년대 초반 처음 인터넷을 접하게 되었는데 그 당시 인터넷을 시작했던 이유는 바로 유명한 슈퍼마리오를 에뮬레이터(Emulator)를 사용하여 플레이 가능했기 때문이죠. 그 당시 콘솔 형태의 게임을 pc에서 할 수 있다는 건 믿기 힘들 정도로 대단했었습니다.처음의 에뮬레이터

  View : 1058 / 2020-10-29
  
• life 횡단보도 앞 신호등이 바닥에 있다 앞으로 횡단보도에서 길을 건널 때 신호등이 잘 보이지 않아 걱정할 고민이 줄어들 것 같습니다. 새로운 형태의 신호 알림 장치를 만났기 때문이죠. 아래에서 확인해 보세요.! 바닥에 긴 형태의 건널목 신호 알림횡단보도 정면에 위치한 신호등의 경우 빨간색, 파란색을 측면에서 확인하기 조금 어려운 부분이 있었는데요 이 새로운 신호등은 매우 긴 형태로 바닥에서 다양한 위치

  View : 385 / 2020-10-29
  
• react [React] 리액트앱에서 페이지 스크롤 방향과 예제 이 글은 자바스크립트 환경에서 스크롤의 방향을 알아내 이를 적용하는 방법인 아래의 글을 React 앱에서 구현하는 예제입니다.더 알아보시려면 아래 링크 참조 바랍니다.https://webisfree.com/2019-12-16/[자바스크립트]-스크롤-이벤트에서-스크롤-방향-알아내는-방법<span data-cu

  View : 1421 / 2020-10-29
• lodash [lodash] 배열의 역순으로 순서 바꾸기, reverse lodash 메소드 중 배열의 순서를 역순으로 바꿔주는 reverse에 대하여 알아봅니다._.revese(Array)lodash의 reverse()는 그 뜻과 같이 배열의 순서를 반대로 바꾸어 주는 역할</

  View : 435 / 2020-10-27
  
• react antd Dropdown 컴포넌트에서 파라미터를 overlay로 전달하는 방법 React antd 라이브러리의 Dropdown 컴포넌트는 자주 사용되는 UI 컴포넌트입니다. 이 경우 드랍다운시 나타낼 메뉴는 overlay를 사용하여 Dropdown될 경우 나타나게 될 엘리먼트로 추가하게 됩니다. 여기서 overlay에 만약 엘리먼트 요소뿐만 아니라 파라미터를 함께 넘기고 싶다면 어떻게 할 수 있을까요?# antd Dropdown 컴포넌트 overl

  View : 295 / 2020-10-23
• db MongoDB 데이터베이스 이름 변경하는 방법은? 아래는 MongoDB에서 데이터베이스의 이름을 변경하는 방법을 알아봅니다.# MongoDB 데이터베이스 이름 변경하기아쉽게도 MongoDB의 데이터베이스 구조상의 이유로 데이터베이스 이름을 바꾸는 간단한 명령어가 존재하지 않습니다. 그 이유는 데이터베이스 이름이 사용하는 모든 컬렉션 및 데이터에 저장되기 때문인데 아래에서는 이를 대체할 방법을 알아봅니다.결국 다른 방법을 찾아야되는데 생각해 볼 수 있는 방법은<spa

  View : 316 / 2020-10-22
• react antd table 컴포넌트 페이지네이션 삭제하기 react에서 사용하는 antd 컴포넌트 중 Table을 사용하는 경우 나타나는 페이지네이션을 숨기거나 삭제하는 방법에 대하여 알이봅니다.! antd의 Table 컴포넌트 페이지네이션 삭제antd의 Table 컴포넌트는 기본값으로 페이지네이션을 자동으로 화면에 출력합니

  View : 522 / 2020-10-20
  
• python Python 기본 파이썬 버전을 Python3로 설정하는 방법 Python 명령어를 실행하는 경우 만약 버전 3를 사용하고 싶지만 Python 버전 2가 기본값으로 되어 있는 경우 Python3를 기본값으로 설정하는 방법을 알아봅니다.# Python 3를 기본으로 사용하는 방법먼저 현재 어떤 버전을 사용하고 있는지 모른다면 python 커맨드를 바로 입력해봅니다.<div

  View : 1883 / 2020-10-18
  
• linux 리눅스 볼륨 크기 늘리기, 파일 시스템 확장 리눅스 환경의 파일시스템 용량을 확장, 늘리는 방법에 대하여 알아봅니다. 참고로 아래의 방법은 AWS 클라우드 환경의 EBS 볼륨을 사용하는 경우의 예제입니다.문제) 리눅스 파일 시스템의 용량의 부족문제의 시작은 AWS 인스턴스에서 사용중인 EBS 볼륨의 크기가 작아 용량이 부족한 문제가 발생하였습니다. 클라우드 환경이므로 EBS의 크기를 현재보다 높여서 적용하였습니다.

  View : 3046 / 2020-10-15
• react react 다이나믹하게 태그 속성, 어트리뷰트 추가하는 방법 react 앱에서 태그 엘리먼트에 속성과 속성의 값을 다이나믹하게 선언하는 방법에 대하여 알아봅니다. (여기서 다이나믹하게 변경한다는 뜻은 상태값에 따라 속성과 그 값이 즉시 추가, 변경되는 것을 의미합니다.)! react 태그 요소에 속성 다이나믹하게 추가하기예를들어 <fieldset> 태그가 존재합니다. 이 태그에 <span

  View : 463 / 2020-10-07
• js 자바스크립트 날짜, 시간 라이브러리 Momentjs 정보와 예제 자바스크립트에서 날짜, date 라이브러리를 가장 잘 알려진 momentjs에 대하여 알아봅니다.<span data-custom-styl

  View : 1129 / 2020-10-06
  
• js [자바스크립트] 엘리먼트의 페이지 위치 알아내기, getBoundingClientRect 자바스크립트를 사용하여 화면(screen)으로부터 DOM 엘리먼트의 위치(position)를 알 수 있는 방법에 대하여 알아봅니다.# DOM 엘리먼트의 위치 구하기이 번에 알아볼 방법은 현재 화면, 윈도우(window)룰 기준으로 특정 엘리먼트의 위치 값을 구하는 방법을 알아봅니다. 아래 스크린샷 처럼 말이죠. 상단과 하단은 스크롤을 이동하여 화면에서 보이지 않는 영역입니다.<img src="/stati

  View : 5105 / 2020-09-21
  
• webdevetc nextjs robots.txt 페이지 설정하기 nextjs 앱에서 robots.txt 파일을 설정하는 방법에 대하여 알아봅니다.# nextjs에서 robots.txt 추가하기nextjs 환경에서 웹크롤러의 크롤링여부를 설정하는 robots.txt 파일을 추가하는 방법입니다.nextjs의 root에는 /public/ 이름의 디렉토리가 존

  View : 911 / 2020-09-19
• webdevetc nginx proxy redirect 프록시 서버 설정하기 nginx에서 프록시 서버 사용을 위해 다른 호스트, 머신으로 이동시키는 설정 방법을 알아봅니다.! 프록시 서버(Proxy server)란?클라이언트와 서버 사이에 존재하는 서버로 클라이언트의 요청을 받아 Reverse에 위치한 서버에 전달하는 상호 중계 목적의 서버를 말합니다. 프락시 서버가 사용되는 이유는 보안이나 트래픽 분산 등의 <span data-custo

  View : 1968 / 2020-09-19
• webdevetc 엑셀에서 json 파일 불러오기 테이블로 변환하기 엑셀 프로그램에서 json 파일을 불러오는 방법에 대하여 알아봅니다.# 엑셀로 json 파일 불러오기이 전에 한 가지 알아두셔야 할 사항이 있습니다. 엑셀 버전에 따라 조금씩 차이가 있을 수 있습니다. 즉 office 신규버전 또는 2013, 2010, 2007 버전 등에 따라 메뉴가 다르거나 없는 기능이 있을 수 있으니 참고하세요. 그럼 아래에서 알아봅니다.<span data-custom-sty

  View : 6268 / 2020-09-19
  
• lodash lodash uniqBy() 메소드 알아보기 lodash 메소드 중 하나인 uniqBy() 메소드에 대하여 알아봅니다.# lodash uniqBy() 알아보기uniqBy()는 lodash 신규 업데이트를 통해 기존의 unique()에서 분리된&n

  View : 1283 / 2020-09-17
  
• webdevetc 윈도우 하위 리눅스 wsl 2 업데이트 이 후 차이점 및 장점 윈도우 하위 리눅스 wsl을 wsl2로 업데이트 한 이 후 문제점 및 장점 등에 대하여 적어보았습니다.# 윈도우 10 하위 리눅스 2 업데이트윈도우 10의 2004 업데이트 이 후 가능한 윈도우 하위 리눅스를 새로운 버전인 wsl 2로 업데이트를 진

  View : 1540 / 2020-09-17
  
• lodash lodash 메소드 uniq() 알아보기 lodash 메소드 중 배열의 고유한 값(unique)만 남길 수 있는 uniq()에 대하여 알아봅니다._.uniq(데이터)간단한 문법은 위와 같습니다. 그렇다면 uniq() 메소드는 언제 어떻게 사용할까요?<span dat

  View : 1372 / 2020-09-15
  
• lodash lodash union 메소드, unique값으로 병합하기 자바스크립트 라이브러리 lodash의 union() 메소드에 대하여 알아봅니다._.union([arrayA, arrayB, ...])간단한 문법은 위와 같습니다. union()에 대하여 아래에서 더 자세히 알아봅니다. # lodash union() 메소드는?

  View : 470 / 2020-09-15
• lodash lodash 정보 및 npm 설치하기, installation 자바스크립트 라이브러리 lodash에 대하여 알아봅니다.# lodash란?lodash는 자바스크립트 라이브러리로 underscore 또는 lodash는 한 번 정도 들어봤을 정도로 많이 사용되는 필수 라이브러리 중 하나 입니다. lodash는 여러가지 유용한 유틸리티 기능을 제공하며 특히 컬렉션

  View : 1163 / 2020-09-11
• db MongoDB 날짜 쿼리문 gte, 크거나 작은 값 MongoDB에서 날짜 값을 기준으로 크거나 작은 값으로 쿼리문을 작성하는 방법을 알아봅니다.# MongoDB 날짜 값 비교하는 쿼리문 작성만약 특정 날짜 보다 큰 데이터만 불러오거나 반대로 특정 날짜보다 작은 데이터만 가져와야 할 경우가 있겠죠. 이 경우에는 NoSQL MongoDB에서는 아래와 같은 키워드를 사용하여 쿼리문을 작성할 수 있습니다.<p class="text text

  View : 1918 / 2020-09-10
• linux [리눅스] 저장장치 용량 등 정보 확인하기, df 리눅스의 저장장치 용량을 확인할 수 있는 명령어 df에 대하여 알아봅니다.# 리눅스 df 명령어 알아보기df는 disk filesystem의 줄임발로 디스크 파일 시스템에 대하여 정보를 알려줍니다

  View : 747 / 2020-09-10
  
• react [react] antd table 컴포넌트 정보 및 예제 React UI 라이브러리 antd의 Table 컴포넌트에 대하여 알아봅니다. antd의 Table 컴포넌트는 테이블 형태의 Layout을 구현하는데 사용됩니다.<Table />그럼 간단한 사용 방법 및 예제를 먼저 알아봅니다.# antd Table 컴포넌트 정보 및 예

  View : 1734 / 2020-09-10
• js 자바스크립트 history 객체 페이지 갱신 없이 페이지 전환, pushstate 자바스크립트를 사용하여 현재 페이지를 새로고침, 갱신하지 않으면서 다른 주소로 변경하는 방법을 알아봅니다.# 자바스크립트 현재 페이지 주소창 url 변경하기현재의 주소창의 url을 다른 것으로 변경하고자 합니다. 이때 페이지는 그대로 유지하고 싶다면 어떻게 할까요? 이 때 사용 가능한 방법이 바로 <span data-custom

  View : 2195 / 2020-09-10
  
• js 자바스크립트 배열값 0으로 초기화 방법 자바스크립트를 사용하여 배열값을 0으로 모두 초기화하는 방법을 알아봅니다.# 자바스크립트 배열값 모두 0으로 초기화하는 방법배열은 수 많은 값들을 시퀀스로 이루어져 있습니다. 만약 배열의 값들이 아래와 같이 모두 임의의 값이라고 가정합니다.let nums = [1, 3,

  View : 3480 / 2020-09-09
  
• js 자바스크립트 객체 프로퍼티의 이름 변경, 바꾸는 방법 자바스크립트의 객체의 프로퍼티 이름을 변경하는 방법을 알아봅니다.! 객체 내부의 프로퍼티 이름 변경하기, change property name가장 간단한 방법은 새롭게 만들고 기존 값을 삭제하는 방법입니다. 순서는 아래와 같습니다.<ul class="po

  View : 1469 / 2020-09-08
  
• react react onClick 파라미터 값 전달하는 방법 React에서 onClick property를 사용하여 클릭 이벤트 발생시 파라미터를 전달하는 방법에 대하여 알아봅니다.# React onClick 파라미터 전달하기, pass parametersonClick은 리액트 앱에서 클릭 이벤트가 발생 할

  View : 5647 / 2020-09-02
  
• webdevetc nextjs custom 404 페이지 만들기 React 프레임워크 nextjs에서 커스텀 404(custom 404) 페이지를 만드는 방법을 알아봅니다.! Custom 404 페이지란?없는 페이지를 주소창에 입력할 경우 '404 not fo

  View : 1509 / 2020-08-31