참조 : https://marketplace.visualstudio.com/ Visual Studio MarketplaceExtensions for Visual Studio family of products on Visual Studio Marketplacemarketplace.visualstudio.com vscode-pdfVS Code에서 PDF 파일을 볼 수 있도록 해주는 Extension Upgrade PDF.js'vscode-pdf'에서 PDF.js를 최신으로 업그레이드하고자 하는 경우 아래 Prebuilt 링크의 ZIP파일을 받아서 지정된 경로의 파일 덮어쓰기 Download latest Prebuilt. Extract the ZIP file. Overwrite ./lib/* by e..
Codepen.io Codepen이라고 검색하면 아래의 링크(https://codepen.io/)가 나오는데요. 웹 브라우저에서 바로 간단한 Front End를 코딩할 수 있는 사이트입니다. CodePen An online code editor, learning environment, and community for front-end web development using HTML, CSS and JavaScript code snippets, projects, and web applications. codepen.io 로그인을 하지 않아도 코딩 테스트가 가능하나 회원가입 후 사용하면 더 많은 기능들을 이용할 수 있기에 가입 후 사용을 추천 드립니다. 사이트의 전반적인 모습은 아래와 같으며 우상단 'Pro..
참조 : https://marketplace.visualstudio.com/ Visual Studio Marketplace Extensions for Visual Studio family of products on Visual Studio Marketplace marketplace.visualstudio.com Excel Viewer VS Code에서 엑셀 또는 CSV 파일을 볼 수 있도록 해주는 Extension ▪ VS Code v1.63.0 or 이후 버전 ▪ Excel Viewer v4.2 이후 'Visual Stuido Code for the Web' 지원(VS Code for Web 참조) CSV Usage Excel Usage Theme Support 현재 Visual Studio Code ..
Smallpdf Smallpdf라고 검색하면 아래의 링크(https://smallpdf.com/kr)가 나오며 온라인 상(다운로드 X, 회원가입X)에서 간단히 PDF 파일을 수정할 수 있는 사이트입니다. Smallpdf.com - PDF와 관련한 모든 문제를 해결해 주는 무료 솔루션 Smallpdf - 모든 PDF 파일을 아주 쉽게 변환, 또는 편집이 가능하게 해줍니다. 뿐만 아니라, 모든 PDF 관련 문제를 저희 웹사이트에서 해결할 수 있습니다. 그리고,,,네, 맞습니다. 무료입니다! smallpdf.com 다만, 무료로 사용할 경우 하루 2개의 파일만 수정이 가능하니 이 점 참고하셔서 사용하면 될 것 같네요. 제약 사항을 없애려면 월 14,000원 또는 연 126,000원의 비용을 지불하고 요금제에 ..
참조 : https://marketplace.visualstudio.com/ Visual Studio Marketplace Extensions for Visual Studio family of products on Visual Studio Marketplace marketplace.visualstudio.com Code Spell Checker 코드 작성시 잘못된 Spell을 체크해주는 Extension ▪ 영어만 가능 ▪ 3글자 이상부터 체크 ▪ 모든 기호 및 부호는 무시 Example Suggestion TIP 제안 목록을 보려면: 단어에 커서를 놓으면 다음 중 하나가 제안 목록을 표시합니다: 왼쪽 여백에 있는 💡(라이트 전구)를 클릭합니다. 빠른 수정 편집기 작업 명령: Mac: ⌘+. or Cmd..
WhatFont 크롬 확장 어플리케이션 중 하나로 현재 웹 브라우저 창에 보여지고 있는 폰트의 정보를 알 수있는 유용한 프로그램입니다. '모방은 창조의 어머니'라고 했던가요..디자이너느 아니지만 그래도 전문가들이 구성해놓은 것을 따라하다보면 절반은 성공하고 들어가지 않을까싶네요. 다운로드는 다음과 같이 크롬 웹스토어에서 WhatFont를 다운로드 받으시면 되겠습니다. WhatFont The easiest way to identify fonts on web pages. chrome.google.com 설치 후 웹 브라우저 주소창 옆에 고정으로 놓아두면 f?라는 아이콘이 보일껍니다. 이게 WhatFont입니다. 옵션을 누르면 아이콘을 변경할 수 있는 기능이 나오는데요...아마 웹브라우저를 Light 또는 D..
UI Coach.io Design에 자신이 없는 분들이나 빠르게 템플릿 같은 것들을 참고하고 싶으신 분들에게 유용한 사이트이다. UI Coach를 사용하면 프로젝트 아이디어, 컬러 팔레트, 글꼴 쌍 등을 쉽게 검색하고 연습할 수 있다. 사이트는 주소는 아래를 참고하도록하고 하나씩 살펴 보도록 하자. https://www.uicoach.io/ Become a better UI designer | UI Coach Become a better UI designer | Color palettes, Font Pairings, And Award Winning Design Inspirations | UI Coach www.uicoach.io 위의 링크로 사이트에 접속하면 나타나는 홈화면은 아래와 같다. 로그인 항목이..
참조 : https://marketplace.visualstudio.com/ Visual Studio Marketplace Extensions for Visual Studio family of products on Visual Studio Marketplace marketplace.visualstudio.com Material Theme Material Theme로 VS Code 스타일을 변경해주는 Extension Theme Images Material Theme 적용(기본 스타일) Override Theme colors Basic example "editor.tokenColorCustomizations": { "[Material Theme]": { "comments": "#229977" } }, Ad..
참조 : https://marketplace.visualstudio.com/ Visual Studio Marketplace Extensions for Visual Studio family of products on Visual Studio Marketplace marketplace.visualstudio.com Material Icon Theme VS Code 안에 Material Icon으로 표시해주는 Extenstion Icon images Settings Folder Colors 명령 창에서 'Material Icons: Change Folder Color' 선택 후 원하는 색상 선택 또는 사용자 설정에서 색상 설정 "material-icon-theme.folders.color": "#ef5350"..
이번 포스팅에서는 VS Code Web에 대해서 소개해보도록 하겠습니다. 미국 기준 21년 10월 20일 VS Code Web을 공개하였었는데요. VS Code를 설치하지 않고 브라우저에서 VS Code를 사용할 수 있는 서비스입니다. 관련 내용은 VS Code 사이트 블로그 포스트에서 vscode.dev(!)와 VS Code for the Web: vscode.dev에서 확인할 수 있습니다. vscode.dev 웹 브라우저에서 vscode.dev라고 입력하면 VS Code가 웹 브라우저 창에서 나타나게 됩니다. File System Access API를 지원하는 브라우저(Chrome, Edge)의 경우 폴더를 바로 열어서 수정도 가능하다고하니 처음치곤 나쁘지 않은 것 같네요. Theme 적용하기 웹 브..
참조 : https://marketplace.visualstudio.com/ Visual Studio Marketplace Extensions for Visual Studio family of products on Visual Studio Marketplace marketplace.visualstudio.com Error Lens 코드에 에러가 있을 경우 해당 줄을 하이라이트하여 알려줌 Features ▪ Diagnostic된 라인 하이라이트 ▪ 행 끝에 진단한 항목에 대해 텍스트 첨부 ▪ 아이콘으로 경고, 에러에 대해 표시 ▪ Status bar에 메시지 디스플레이 Commands Command Description errorLens.toggle Error Lens: Toggle (Enable/Disa..
참조 : https://marketplace.visualstudio.com/ Visual Studio Marketplace Extensions for Visual Studio family of products on Visual Studio Marketplace marketplace.visualstudio.com Better Comments 코드에서 주석 처리시 색상으로 분류하여 좀더 직관적으로 주석 처리가 가능하도록 도와주는 Extension Features ▪카테고리로 주석을 분류 (알림, 쿼리, 작업 관리, 하이라이트) ▫ * 문자 : 초록색으로 표시 - 일반 정보 ▫ ! 문자 : 빨간색으로 표시 - 주의 사항 ▫ ? 문자 : 파란색으로 표시 - 쿼리 ▫ TODO 문자 : 주황색으로 표시 - 해야할 ..
참조 : https://marketplace.visualstudio.com/ Visual Studio Marketplace Extensions for Visual Studio family of products on Visual Studio Marketplace marketplace.visualstudio.com Python Enviroment Manager 파이썬 환경과 패키지들에 대해서 관리해주는 기능 Features ▪ 모든 Python 환경을 유형별로 그룹화하여 보기 (Conda, PyEnv 등) ▪ 환경이 활성화된 터미널 생성 ▪ Conda 및 가상 환경 생성/삭제 ▪ Micromamba를 사용하여 Conda와 함께 Python 설치 ▪ Python Extension에서 사용하는 Python 인터..
이번 포스팅에서는 폴더를 ISO 파일(*.iso)로 변경하는 소프트웨어를 소개하겠습니다. Folder2ISO 홈페이지(http://www.trustfm.net/software/utilities/Folder2Iso.php)에 접속하여 Folder2Iso를 받도록한다. (포스팅은 1.7버전 기준이지만 홈페이지의 최신 버전은 22.04.29 기준으로 3.1버전이다.) Folder2Iso - Official Page www.trustfm.net 실행 방법 다운로드 받고 프로그램을 실행시키면 다음과 같은 창이 나타난다. 위쪽에는 내가 iso로 변경시키고자하는 파일 경로를 지정하고 아래쪽에는 iso파일 생성 경로를 설정하면 된다. 그럼 프로그램 설치 USB(D 드라이브 경로)의 파일들을 iso로 한번 만들어보겠다...
요즘은 정말 시대가 많이 변해서 인터넷과 의지만 있으면 공부할 수 있는 그런 세상인 것 같네요. 수포자들이나 너무 오랫동안 수학을 크게 다루지 않아 까먹으신 분들에게 유용한 미적분 사이트가 있어서 공유하고자 합니다. 저 또한 한 때 수리 영역은 1등급이었는데,,,제가 푼게 맞나 싶더라고요. 사이트에 수식만 입력하면 Step별 연산 과정 확인이 가능하니 직접 풀어본 값과 검증을 해볼 때에도 유용하게 쓸 수 있을 것 같습니다. 미분(derivate) 계산 사이트 Derivative-Calculator라는 사이트(http://www.derivative-calculator.net/)로 접속하시면 수식을 입력한 후 바로 미분 값에 대한 결과나 과정을 살펴볼 수 있는 사이트입니다. Derivative Calcula..
컴퓨터 화면을 녹화할 때 우리는 보통 무료 소프트웨어(대표적인게 반디캠)나 윈도우에서 제공하는 게임 녹화 기능(윈도우키+G)로 녹화를 할텐데요. 이외에도 OBS Studio라고 하여 좋은 무료 툴이 있어 소개하려고 합니다. OBS Studio Open Broadcaster Software의 약자로 C, C++ 기반으로 개발된 무료 소프트웨어입니다. RTMP를 지원하고 있어 트위치 스트리머 분들 또는 유투브 크리에이터 분들이 스트리밍 중 컴퓨터 화면 송출을 위해서 많이 사용하는 프로그램이라고 합니다. 위에서 잠깐 언급한 반디캠 또는 윈도우 게임 녹화 기능을 통해서도 가능한데요. OBS Studio를 굳이 사용하는 이유는 먼저 반디캠의 경우 부분 유료화로 간단한 녹화는 무료로 가능하지만, 녹화 시간에 제한(..
HTML, CSS 등 텍스트 관련 자료를 살펴보던 중 괜찮은 에디터가 있어서 추천해보려고 한다. Atom Text Editor로 편리한 텍스트 작성을 위해 Github에서 개발하였고 주요 특징은 무료, 플러그인을 통한 확정성이다. 그리고 맘에 들었던 이유 중 하나인..깔끔하다..! 그럼 설치하여 사용해보자. Atom Text Editor 사이트(https://atom.io/)에 접속하여 Atom Editor를 다운로드 받도록 한다. A hackable text editor for the 21st Century At GitHub, we’re building the text editor we’ve always wanted: hackable to the core, but approachable on the f..
HTML(HyperText Markup Language) ▸ 웹을 이루는 가장 기초적인 구성 요소로 웹 콘텐츠의 의미와 구조를 정의할 때 사용 ▸ 하이퍼텍스트(HyperText)란, 웹 페이지를 다른 페이지로 연결하는 링크를 말함 ▸ 웹 브라우저에 표시되는 글과 이미지 등 다양한 컨텐츠를 표시하려면 마크업(Markup)을 사용해야 함 ▸ 태그(Tag)를 사용해서 문서의 다른 텍스트와 구분 지음 ("" 과 같은 형태) ▸ 태그 안의 요소 이름은 대소문자 구분하지 않음 ▸ 가장 기본적인 형태는 꺾쇠 괄호를 이용한 아래와 같은 형태임 ▸ 주석은 ""와 같은 형태로 입력하여 사용함 HTML 버전 테이블표 출처 : 나무위키(Namu.Wiki) 버전 공개일 내용 HTML 1.0 1991년 - 최초의 HTML. 팀 ..
디자인을 고민할 때 그라데이션을 적용하고싶을 때가 있는데 그럴 때 사용하기 유용한 사이트를 소개해 보려고 한다. 검색 창에서 'UI Gradient'라고 검색해보면 쉽게 찾을 수 있으며 다양한 조합의 그라데이션 샘플들을 확인할 수 있다. UI Gradient https://uigradients.com/#BoraBora uiGradients - Beautiful colored gradients uiGradients is a handpicked collection of beautiful color gradients for designers and developers. uigradients.com 위의 링크로 사이트에 접속하면 가장 먼저 그라데이션이 나타나는 페이지가 나타난다. 정해진 스타일이지만 깔끔하게 색..
이번 글에서는 PC 화면을 녹화하여 GIF로 만들 때 유용한 툴을 소개하겠습니다. 간단한 작업의 경우 녹화를 하기보다는 간략하게 GIF로 보여주는 것이 더 효과적일 수 있는데요. 이럴 경우 "ScreenToGif"란 프로그램을 통하여 손쉽게 GIF파일을 만들 수 있습니다. GIF 파일이란, 그래픽 인터체인지 포맷(Graphics Interchange Format, GIF)의 줄임말로 256가지의 색상 정보를 저장할 수 있는 비손실 압축 형식의 파일입니다. 1987년에 발표된 파일 포맷으로 애니메이션을 지원하는 파일 포맷 중 가장 간편하고 대부분의 브라우저에서 지원하고 있기 때문에 아직까지 사용을 하고있습니다. ScreenToGif 다운로드 방법 프로그램 설치를 위해 ScreenToGif 홈페이지에 접속하..
프로그램을 만들 때 참 고민이 되는게 디자인,,그리고 색감 선택특히 엔지니어들에게는 이 '색 조합'이라는게 굉장히 어렵다ㅠㅠ당장은 괜찮아보이다가도 시간이 지나면 되게 촌스러워보이는..?그래서 오늘은 괜찮은 색 조합 사이트 어도비 컬러CC 소개하려고한다. 어도비 컬러 CC(Adobe Color CC) https://color.adobe.com/ko/create/color-wheel 위의 링크로 들어가거나 웹 브라우저에서 쉽게 'Adobe Color'라고 검색하면 해당 사이트를 찾을 수 있다.상단에 로그인 창이 있지만 굳이 할 필요없이 바로 원하는 색조합을 만들 수 있다.로그인을 하면 내가 만든 조합들을 저장하거나 공유할 수 있다고 한다. 휠안의 아이콘을 움직여서 원하는 팔레트를 만들면 되는데 5가지 색상 ..