BE/Web 썸네일형 리스트형 [웹] 워드클라우드 그리기 (javascript, anyChart) 인트로 안녕하세요. 오늘은 워드클라우드를 HTML/CSS 로 그리는 방법에 대해서 포스팅하겠습니다 :D 워드 클라우드는 '단어 구름'이라는 뜻으로, 핵심 단어를 시각화하는 기법입니다. 문자의 빈도 수를 직관적으로 나타내어 문서의 키워드/개념들을 빠르게 파악할 수 있는 기법인데요. AnyChart라는 라이브러리를 사용해 html/css/js 로 손쉽게 그릴 수 있습니다. 목차 1. Wordcloud & AnyChart 2. anyChart URL 3. 커스터마이징 및 구현 1. Wordcloud & AnyChart 워드클라우드란 빅데이터에서 자주 쓰는 용어로, 문서의 자주 사용되는 단어 집합을 구름처럼 나타낸 시각화 기법입니다. AnyChart는 워드 클라우드를 그려주는 자바스크립트 라이브러리로, 사용하기.. 더보기 [웹] 로컬에 웹 서버 구축하기 / 가상호스팅 설정 인트로 로컬에 웹서버를 구축하고 가상 호스팅을 설정하기 위해서는 먼저 Mongodb와 xampp가 설치되어야합니다. [1단계] Xampp를 설치하는 글 보러가기(클릭) [2단계] Mognodb를 설치하는 글 보러가기(클릭)\ [3단계] 가상호스팅 설정하기 (클릭) [3단계] 로컬(localhost)에 웹 서버 구축하기 1. composer download (windows) https://getcomposer.org/Composer-Setup.exe 위의 링크에서 laravel 프레임워크 설치를 위한 composer을 설치한다. 2. cmd에서 라라벨 설치 명령어 입력 다음과 같은 라라벨 명령어를 입력한다. 1) composer global require laravel/installer 2) laravel.. 더보기 [웹] 로컬에 웹서버 구축하기 / MongoDB설치 인트로 안녕하세요. XAMPP 위에 mongodb를 얹어서, 로컬에 웹 서버를 구축해보고자 합니다. [1단계] Xampp를 설치하는 글 보러가기(클릭) [2단계] Mognodb를 설치하는 글 보러가기(클릭) [3단계] 가상호스팅 설정하기 (클릭) 1. 자신의 php 버전에 맞는 Mongodb 다운로드하기 https://pecl.php.net/package/mongodb/1.5.3/windows 필자는 php 7.3의 Thread Safe(TS) x86 을 설치했다. +) Thread Safe 를 다운받을지 Non Thread Safe를 다운받을지는, http://localhost/dashboard/phpinfo.php 에서 확인해보면 된다. 2.xampp에 mongodb 추가하기 C:\xampp\php에.. 더보기 [웹] 로컬에 웹서버 구축 / XAMPP설치 인트로 안녕하세요. 로컬에 웹서버를 구축하기 위해서는 Mongodb와 xampp가 설치하고 가상 호스팅이 설정되어야합니다. [1단계] Xampp를 설치하는 글 보러가기(클릭) [2단계] Mognodb를 설치하는 글 보러가기(클릭) [3단계] 가상호스팅 설정하기 (클릭) [1단계] XAMPP 설치로 로컬에 웹 서버 구축하기 1. XAMPP Download 에서 설치파일 다운로드 https://www.apachefriends.org/download.html 필자는 윈도우 환경에 XAMPP를 설치했고, 가장 최근 지원 버전인 PHP 7.3.2를 설치했습니다. 2. XAMPP 설치파일 실행 설치파일을 다운로드하고 실행하면 이러한 알림창이 뜨는 데, C:\에 설치할것이므로 OK를 누르고 가뿐히 무시한다. 3. X.. 더보기 [웹][php] MVC(모델,뷰,컨트롤러) MVC란, 모델 - 뷰 - 컨트롤러의 약자이다. 현재 많은 프레임워크들이 MVC모델을 사용한다. MVC자체는 비즈니스 로직과 사용자 뷰 영역을 분리하기 위한 소프트웨어 디자인 패턴이다. 이 패턴을 사용하면, 비즈니스 로직과 사용자 뷰 영역이 서로 영향 없이 쉽게 고칠 수 있는 애플리케이션을 만들 수 있다. 모델은, 데이터를 전달하며 , 데이터를 컨트롤러나 뷰에 전달한다. (백그라운드) 라라벨 프레임워크에서 artisan 을 통해 모델을 만드는 명령어는 다음과 같다. 1 php artisan make:model Test cs 컨트롤러는 데이터와 뷰 사이의 상호동작을 관리하는데, 모델에 명령을 전달하여 데이터의 상태를 변경하거나, 뷰에 명령을 전달한다. 라라벨 프레임워크에서 artisan 을 통해 컨트롤러를.. 더보기 [웹][javascript] confirm() 으로 ajax 구문 실행 인트로 안녕하세요. 오늘은 confirirm()으로 ajax구문을 실행하는 방법을 포스팅하겠습니다. 자바스크립트에는, 대화상자로 alert, confirm, prompt가 있습니다. 1) alert() : 단순히 메시지 전달 2) confirm() : 확인 , 취소에 따라 true, false를 반환 3) prompt() : 알림창에서 사용자가 입력한 값을 받아서 리턴 그 중 확인, 취소에 따라 true, false를 반환하는 confirm()에 대해서 사용법을 알아볼 것입니다. (확인을 누르면 ajax 구문 실행) confirm()의 사용법 confirm()의 사용법은 아래와 같다. 1) 자바스크립트 confirm() 이용해서 확인창 띄우기 - 다음과 같이 if문을 이용해 confirm()의 결과에 따.. 더보기 [웹] 코드 정리 및 비교 사이트 인트로 안녕하세요. 오늘은 코드 정리 및 비교 사이트에 대해 포스팅하겠습니다. 개발을 하다보면 두개의 소스를 비교하여 내가 어떤 부분을 고쳤는지 알고싶거나 소스 코드를 정리하고 싶을 때가 있습니다. 그러할 때마다 다음과 같은 사이트를 사용하면 유용합니다. 실제로 제가 사용하고 있는 사이트들입니다 :D 1. 개발 소스 코드 비교 사이트 1) diffchecker (개인적으로 추천) : https://www.diffchecker.com/ 부가설명 - 원 코드와 변경된 코드를 넣으면 두개의 소스를 비교해줍니다. - 원코드와 비교할 코드를 입력하고 'find difference'를 클릭하면 됩니다. - 타 사이트 대비 UI가 비교적 깔끔하다. 2. 소스 코드 정리 사이트 1) arantius : https://.. 더보기 [웹][javascript] ajax 통한 데이터 전송 ajax란? ajax는 비동기적인 웹 애플리케이션의 제작을 위해 이용하는 개발 기법이다. 비동기란? 비동기란, 각 작업이 완료될 때까지 기다리지 않고 요청한 작업을 처리하는 방식이다. 이 비동기식 방법은 서버에 부하를 덜고 사용자와의 상호작용을 증가시킨다. 다음은 웹의 프론트엔드(frontend)에서, 입력된 데이터를 서버로 전송하는 ajax 코드 해석이다. 1) 이벤트 전파 중단 방법 event. preventDefault() : 현재 이벤트의 기본 동작을 중단 event.stopPropagation() : 현재 이벤트가 상위 부모로 전파되지 않도록 중단 event.cancleBubble = true; - event.stopPropagation()의 별칭이다. - 이벤트 핸들러에서 반환되기 전에 tru.. 더보기 이전 1 2 다음
