갤럭시탭을 사용하다보면 가로로 사용하고 싶지만 세로전용 어플이라서 가로로 사용할 수 없는 어플이 있습니다. 아마 갤럭시탭을 사용하면 제일 처음 느끼는 불편함 입니다. 갤럭시 Good Lock 어플을 사용하면 이 불편함을 해결할 수 있습니다. 설치방법 먼저 갤럭시 스토어를 실행해서 검색창에 Good Lock을 검색합니다. 그럼 이렇게 Good Lock 어플이 나오는데, 바로 설치를 해줍니다. Good Lock 어플을 실행하면 또 파생되는 어플을 설치하는 화면이 나오는데, 여기서 'MultiStar' 어플을 터치하여 들어가 설치합니다. MultiStar 어플을 설치하면 위의 화면이 나오는데, 맨 위의 "I ♡ Galaxy Tablet" 메뉴를 터치합니다. 위에서 두번째에 "웬만하면 가로로 돌려드림" 이라는 ..

이제 라이브러리 관련 콘텐츠를 거의 소진해서 다른 걸 써보려고 했는데.. 찾다 보니 별의별 라이브러리가 다 있어서 한동안은 이런 글이 계속 올라올 것 같네요 ㅎㅎ;; 문자열 라이브러리 Voca.js Front-End 작업을 하면서 자바스크립트를 이용해 문자열 작업을 하다 보면 가끔 부족함을 느끼게 됩니다. 저도 C#이나 JAVA의 프레임워크에서 제공하는 다양한 문자열 함수를 사용하다가 자바스크립트를 쓰면 가끔 부족한 느낌을 받곤 했습니다. Voca.js를 추가하여 사용하면 이런 답답함을 풀어주고 더 다양한 기능을 제공합니다. Voca.js 링크 vocajs.com/ Voca: The ultimate JavaScript string library Voca provides functions to manipu..

PPT를 만들다 보면 그림으로 설명해야 할 경우가 많고 다양한 그림들이 필요합니다. 특히 설명하기 좋게 심플한 픽토그램이 PPT에 사용하기 아주 좋습니다. 이러한 다양한 픽토그램을 무료로 이용할 수 있는 사이트가 있습니다. Noun Project thenounproject.com/ Noun Project: Free Icons & Stock Photos for Everything thenounproject.com 외국 사이트라서 모든 검색은 영어로 해야 한다는 점이 단점입니다. 하지만 우리는 학창때 영어 공부를 했습니다. 가뿐하게 영어로 원하는 그림을 검색해보죠. 사용방법 예를들어 "자연과 생태계"라는 주제로 PPT를 만든다 했을 때 우리는 자연에 관한 픽토그램을 찾을 것입니다. 검색창에 'Nature'를..

billboard.js 관한 이전 포스트 wooncloud.tistory.com/35 오픈소스 차트 라이브러리 billboard.js 코로나가 터지면서 많은 개발자들이 코로나 현황과 정보를 실시간으로 보여주기 위해 사이트를 개발했습니다. 코로나 현황을 보여주다보면 전일대비 얼마나 확진자가 증가했는지 등 한눈에 파 wooncloud.tistory.com billboard.js 링크 naver.github.io/billboard.js/ billboard.js billboard.js, the "chart" library The name "billboard" comes from the famous "billboard chart" which everybody knows. billboard.js provides t..

원래 직접 날짜 변환 코드를 만들어서 포스팅하려고 했다가.. 관련 코드 참고하려고 검색했더니 더 좋은 라이브러리를 발견해서 또 라이브러리 소개 포스팅을 하게 되었네요. 이번에 가져온 라이브러리는 날짜 포맷을 쉽게 설정하는 라이브러리입니다. moment.js 라이브러리 1. 홈페이지 momentjs.com/ Moment.js | Home Format Dates moment().format('MMMM Do YYYY, h:mm:ss a'); moment().format('dddd'); moment().format("MMM Do YY"); moment().format('YYYY [escaped] YYYY'); moment().format(); Relative Time moment("20111031", "YYYY..

코로나가 터지면서 많은 개발자들이 코로나 현황과 정보를 실시간으로 보여주기 위해 사이트를 개발했습니다. 코로나 현황을 보여주다보면 전일대비 얼마나 확진자가 증가했는지 등 한눈에 파악하게 알려주기 위해선 차트 사용이 필수적입니다. billboard.js 를 사용하면 데이터들을 차트로 쉽게 구현할 수 있습니다. billboard.js 란? billboard.js는 C3.js를 변형한 라이브러리 입니다. MIT 라이센스인 C3.js 를 네이버에서 변형하여 불편한 부분을 편리하게 만들어서 오픈소스로 배포하고 있습니다. c3js.org/ C3.js | D3-based reusable chart library Comfortable C3 makes it easy to generate D3-based charts by..

세상이 바뀌면서 유튜브나 넷플릭스, 왓챠 등 스트리밍 서비스가 많이 생기게 되면서 천천히 케이블 TV 대신에 미디어 스트리밍 서비스를 많이 사용하게 되었습니다. 가정에는 TV가 하나쯤 있는데 대부분 일반 케이블 TV입니다. 가끔 그 TV가 유튜브나 넷플릭스를 재생할 수 있다면 좋겠다는 생각을 하죠. 그래서 사람들이 스마트 TV를 다시 구매하는 경우가 종종 있는데요. 이미 있는 TV 바꾸기엔 가격도 많이 나가고 번거롭기만 합니다. 저도 집에 빔프로젝트가 있는데 매번 사용하던 노트북을 HDMI 선으로 연결하여 사용하고 했는데 그 대안으로 샤오미 미 TV 스틱 (Xiaomi Mi TV Stick)를 구매하게 되었습니다. 샤오미 미 TV 스틱 (Xiaomi Mi TV Stick) 가격이 3만원대의 아주 저렴한 ..

안녕하세요. 운구름입니다. 이번에 '갤럭시탭 S7+'를 구매하게 되어 정보를 드리고자 이렇게 포스팅을 하게 되었네요. 갤럭시탭 S7과 갤럭시탭 S7+ 가 출시가 되면서 사람들이 많이 발전한 갤럭시탭을 보고 호평이 많았습니다. 저도 이번에 블로그 포스팅과 각종 작업들을 위해 아이패드를 살까 갤럭시탭을 살까 고민을 많이 했습니다. 저는 갤럭시 폰을 사용하는 사람으로서 아이패드보다 갤럭시탭을 구매를 망설이다가 삼성전자 매장에서 어느 정도 사용해 보고 구매를 결정하게 되었습니다. 갤럭시탭 리뷰 포스팅 리스트 갤럭시탭은 2가지 포스팅으로 리뷰를 진행하려고 합니다. 1. 언박싱 2. 사용 후 리뷰 https://coupa.ng/bQrrbE 삼성전자 갤럭시 탭S7+ 12.4 Wi-Fi 256GB COUPANG www..

OSI 7계층 이란? 네트워크 통신에서 생기는 여러가지 충동문제를 해결하기 위해서 국제 표준화 기구 ISO (International Organization for Standardization)에서 제시한 네트워크 기본 모델입니다. 네트워크 장비간 호환성을 위해 만들어졌습니다. OSI 7계층 7. 어플리케이션 계층 (Application Layer) 사용자들이 사용하는 네트워크 응용프로그램입니다. 사용자와 직접적으로 상호작용하는 계층입니다. 대표적인 프로토콜 : HTTP, FTP 등 전송단위 : 데이터 (DATA) 5. 표현 계층 (Presentation Layer) 어플리케이션에서 보낸 정보를 다른 시스템의 어플리케이션에서 읽을 수 있도록 데이터셩식을 설정하고 부호화 및 암호화/복호화 합니다. 대표적인..

function hanoi(num, from, to ,other){ if(num == 0) return; hanoi(num-1, from, other, to); console.log(`${num}을 ${from}에서 ${to}로 보낸다`); hanoi(num-1, other, to, from); } hanoi(5,'A','B','C');

재미있는 사이트가 있어서 찾아왔습니다. 일반 그림을 도트 그래픽으로 바꾸었으면 좋겠다고 생각하시는 분들은 아래의 링크를 통해서 쉽게 그 생각을 이룰 수 있습니다. app.monopro.org/pixel/ ドット絵こんばーた 画像をモザイク化→色をクラスタリングしてドット絵っぽくします。 途切れ途切れの輪郭線とかノイズのドットが気になるときは平滑化するとマシになるかも。 質問とか要望とか言いたい app.monopro.org 처음에 링크를 통해서 들어가면 위와 같은 화면이 나옵니다. 사용법 OPEN IMAGE를 선택하여 사진을 고릅니다. 위의 사진의 옵션을 적당히 골라서 그림을 만들어봅시다. 저는 안드로메다 은하를 픽셀 이미지로 바꾸어 보았는데요. 위의 옵션대로 세팅한게 제일 예쁜것 같습니다. 하지만 picture by pic..

웹 개발을 하면서 날짜를 선택하여 사용자로부터 기간을 받고 싶을 때, 여러분들은 어떻게 하나요? 기본적으로 input 태그에 type을 date로 하여 2개의 input 필드를 만들 겁니다. See the Pen basic-date by wooncloud (@lomeiskk) on CodePen. 하지만 위의 방법은 첫 날짜가 마지막 날짜보다 이후의 날짜가 될 수 없고, 여러 가지 유효성 검사를 해야 하며, 직관적이지 않고 불편한 부분이 많습니다. 물론 제이쿼리 UI에서 제공하는 Date Picker를 보면 아래와 같이 기간을 설정할 수 있는 기능이 있습니다. 하지만 제 눈엔 예뻐 보이지 않네요. 여러분은 어떤가요? 이 디자인이 예쁘다면 사용하면 되겠지만, 그렇지 않으면 CSS를 싹 바꿔야 할지도 모릅니..

가끔 디자인 작업을 하면서 픽토그램 자료가 필요한 경우가 많습니다. 하지만 대부분 단순하거나 정형화된 픽토그램 밖에 없어서, 특이한 픽토그램이 필요할 때 "일러스트레이터를 배워야 하나.." 하고 생각하게 됩니다. 이번에 소개해드릴 사이트는 정말 특이한 픽토그램이 많이 있는 이상한 픽토그램 사이트입니다. 1. 사이트 링크 pictogram2.com/ human pictogram 2.0 (無料人物 ピクトグラム素材 2.0) pictogram2.com 일본 웹 사이트입니다만 상단에 일본어 / 영어 중에 원하는 언어로 골라서 사이트를 이용할 수 있습니다. 하지만 한국어가 없으니 구글 번역을 사용하여 쓰시는 것을 추천드립니다. 2. 라이선스 및 금지사항 위의 사이트에서 게시한 라이센스 관련 내용은 여기서 볼 수 있..

유튜브 크리에이터 '어비' 라는 분께서 여러 유튜버 손글씨체를 폰트로 담은 어비폰트입니다. uhbeefont.com/ 어비폰트 : 저작권 무료 폰트 저작권 무료 폰트 끝판왕 by 어비 uhbeefont.com 예쁜 손글씨체를 원하면 이 홈페이지에서 다운받아 사용하면 좋을것 같습니다. 하지만 고딕체를 원하신다면 조용히 뒤로가기 버튼을 눌러주시면 되겠습니다. (손글씨체라 고딕체가 없습니다.) 참고로 어비폰트는 상업적 용도/변형 사용에도 무료입니다.

function formatDate(date) { var d = new Date(date), month = '' + (d.getMonth() + 1), day = '' + d.getDate(), year = d.getFullYear(); if (month.length < 2) month = '0' + month; if (day.length < 2) day = '0' + day; return [year, month, day].join('-'); } 출처 : stackoverflow.com/questions/23593052/format-javascript-date-as-yyyy-mm-dd Format JavaScript date as yyyy-mm-dd I have a date with the format ..

웹사이트를 제작하다 보면 사용자의 요청을 처리하는 동안 사람들의 조작을 잠시 막아둘 필요가 있을 때가 종종 찾아옵니다. 그럴 때 페이지마다 오버레이용 CSS를 만들어두거나 각 컨트롤러에 readonly를 걸어두는 등 복잡한 일을 하죠. 이번에 소개해드릴 loading.js는 로딩 중이라는 표시를 보여주고, 특정 공간의 사용자 조작을 막을 수 있는 플러그인입니다. 1. loading.js 웹사이트 carlosbonetti.github.io/jquery-loading/ jquery-loading Themes and default styles You must include the dist/jquery.loading.css file in your page if you want to use the default ..

자바스크립트 AddDays 문자열로 이루어진 날짜에 더하고 싶은 일 수를 넣으면 그 날만큼 지난 날짜로 반환 매개변수 - date : 예시, '2020-10-15' 매개변수 - days : date에서 더하고 싶은 날짜 (음수 가능) 반환 : date에서 days만큼 더한 날짜 출력 function AddDays(date, days) { // date는 문자열로 받는다 ex, '2020-10-15' var result = new Date(date); result.setDate(result.getDate() + days); return result; }

자바스크립트 IsNullOrWhiteSpace 매개변수에 들어온 값이 undefined나 null인지 빈 string ("")인지 체크합니다 매개변수 : 빈값을 체크하고 싶은 내용 반환 : undefined 이거나 null 이거나 빈 string ("") 이면 true / 내용이 있으면 false // input값이 공백이거나 빈값이 있는지 없는지 체크 function IsNullOrWhiteSpace(input) { if (typeof input === 'undefined' || input === null) return true; return input.replace(/\s/g, '').length < 1; }

사진 2개를 주면 자동으로 합성하여 예술작품으로 만들어주는 인공지능이 있다는 것을 아시나요? Ostagram 오스타그램은 이런 재미있는 일을 해줍니다. 아래의 그림이 오스타그램 인공지능이 만든 재미있는 사진들입니다. 1번, 2번 사진이 원본 사진이고 3번이 합성사진입니다. 신기하지 않은가요? 어떻게 인공지능이 이렇게 예쁘게 그림을 합성할 수 있지? 생각이 드실 겁니다. 이 인공지능은 특별한 사람이 쓸 수 있는 것이 아닌 누구나 사용할 수 있습니다. 여러분도 쉽게 예쁜 사진 만들어보시지 않으시겠어요? Ostagram 사용방법을 알려드리겠습니다. 1. 사이트 이동 www.ostagram.me/ Ostagram www.ostagram.me 어마어마한 신이 지키고 있는 느낌의 이 사이트.. 오스타그램 링크입니다..

안녕하세요 운구름입니다. 최근 들어 인생의 작은 전환점을 만들고자 바쁜 일상을 보내고 있습니다. 그래서 최근에 블로그 포스팅이 잠시 뜸해졌는데.. 일이 잘 풀린다면 몇 달간 더 바빠져 블로그 포스팅이 적어질 수 있고, 아니면 다시 돌아올 것 같네요. 그래도 아직은 작은 포스팅으로 꾸준히 운영하겠습니다. 그리고 앞으로 어떻게 블로그를 운영할지 두 가지 적어보겠습니다. 1. 좀 더 잡스런 포스팅이 많아질 것입니다. 이제 조금 일상이나, 제품 및 맛집 리뷰, 기타 등등 이야기가 담긴 포스팅이 늘어납니다. 특히 옛날에 별자리에 관한 지식에 관심이 많았는데, 그런 부분도 한번 다뤄볼까 생각 중입니다. 2. 주요 전공 관련 포스팅으로 유니티 초보 강좌를 올려볼 예정입니다. 현재 주 전공이었던 유니티를 안 쓰고 있는..

이 포스트는 아래 출처를 인용하여 작성한 포스트 입니다. 출처 : slowalk.tistory.com/2242 세상에 여러가지 폰트가 많이 있지만 프로그래머 여러분들은 혹시 코딩용 폰트가 있다는것을 알고 계시나요? 이 코딩용 폰트는 코드 가독성을 올려줄 뿐만 아니라, 혼동되는 글자를 구분시켜주기까지 합니다. " 그런데 그냥 아무 폰트를 사용해도 코딩에 지장이 없던데요? 코딩하면서 폰트까지 바꿔야하나요? " 물론 그냥 사용하셔도 되겠습니다만, 드물게 이 폰트 하나때문에 불필요한 시간소모가 생길 수 있습니다. 다음 사진을 보시죠. 비슷한 문자들을 구분하기 위의 사진을 보면 1자 모양의 문자가 5개나 있습니다. 일반 폰트로 보면 모두다 l 모양으로 나오겠죠. 하지만 코딩용 글꼴은 이 모든 문자들을 다 구분 할..

이전 포스팅에 SweetAlert2라는 Alert에 관한 포스트를 올린 적이 있습니다. 그 SweetAlert2 안에 Toast 메시지를 구현할 수 있었는데요. 아무래도 SweetAlert2 특성상 간단한 Toast메시지도 톡 튀게 애니메이션이 표현이 되곤 했습니다. "저는 심플한 toast 메시지를 쓰고 싶어요!!" 라고 하시는분들을 위해, 이번엔 작고 가벼운 플러그인을 하나 소개해 드릴까 합니다. toastr💬 codeseven.github.io/toastr/demo.html toastr examples codeseven.github.io 이름이 딱 이거는 그냥 요리보고 조리봐도 toast 플러그인이다.라고 생각할 수 있는 직관적인 이름의 플러그인입니다. 1. 설치하기 위의 링크는 데모버전을 볼 수 ..

안녕하세요 운구름입니다. 이번엔 제가 정보 저장할 겸, 좋은 정보 소개해드리려고 이렇게 포스팅하게 되었습니다. 이 유튜브 시대에 누구나 컨텐츠를 만들면서 한번쯤은 저작권과 음원관련해서 고민을 해보신 경험이 있으실겁니다. 이럴때 NCS와 같은 유튜브 채널에서 출처를 밝히는 대신 무료로 음악을 사용할 수 있게 제공하는 채널도 있습니다. 그런데 NCS를 들으면 대부분 일렉트로닉 음악이라 잔잔하고 그루브한 음악이 필요할때 아쉽잖아요. 그래서 그런 장르를 대표하는 무료음원 채널을 소개해드리려 왔습니다. 🎵브금대통령!🎶 www.youtube.com/user/GwooA/featured 브금대통령[Bgm President] ✔️모든 음원 100% 자체제작! ✔️무료 사용 가능 범위 : 유튜브, 페이스북, 인스타그램, ..

자바스크립트로 웹 프로그래밍을 하다 보면 자주 Alert 함수를 사용하게 됩니다. Alert는 사용자에게 알림을 주고자 할 때 사용하는데요. 자바스크립트의 alert는 아주 기본적인 브라우저 UI를 제공하고 있습니다. 하지만 우리는 이런 알림창보다 더 예쁜 알림 창을 원하죠. SweetAlert2!! sweetalert2.github.io/ SweetAlert2 A beautiful, responsive, customizable and accessible (WAI-ARIA) replacement for JavaScript's popup boxes sweetalert2.github.io 해당 링크로 들어가면 사이트가 워낙 관련 내용을 잘 설명해줘서 제가 뭐 자세히 설명해 드릴 것이 없지만, 기본적으로 어떤..