IT이야기/Google프로그램 2022. 8. 24. 0
Google Workspace 무료 사용 방법
구글이 자신들의 수익모델은 광고라고 하면서 천사처럼 많은 유용한 서비스를 무료로 제공하다가 거의 독점적인 지위를 획득 한 다음에 돈을 내라고 하는 모습을 슬슬 보이고 있습니다. 마음에 들지 않지만 대안이 없는 상황에 울며 겨자 먹기로 비용을 지불하게 됩니다. 그러나 괘심하긴 해도 완성도 높은 서비스를 처음에 무료로 제공해 주니 개인 사용자 입장이라면 나쁘게만 보기도 어렵기는 합니다. 그런 서비스 중에 Google Workspace가 있는데 이 서비스도 기업에서 사용하면 유료의 비용을 지불해야 하지만 개인이라면 대부분 무료로 사용할 수 있습니다. Google Workspace에는 아래의 프로그램들이 포함되어 있습니다. Google Workspace Docs : MS워드 같은 워드프로세서 프로그램 Sheet..
WEB개발이야기/React.js 2022. 7. 14. 0
React.js에서 JSX사용하기
JSX란? React에서 JSX는 필수 요소는 아니지만 React를 코딩하는데 많은 편리함을 더해주는 확장 문법이라고 보면 됩니다. JSX란? - React 공식웹사이트 React에서는 본질적으로 렌더링 로직이 UI 로직(이벤트가 처리되는 방식, 시간에 따라 state가 변하는 방식, 화면에 표시하기 위해 데이터가 준비되는 방식 등)과 연결된다는 사실을 받아들입니다. React는 별도의 파일에 마크업과 로직을 넣어 기술을 인위적으로 분리하는 대신, 둘 다 포함하는 “컴포넌트”라고 부르는 느슨하게 연결된 유닛으로 관심사를 분리합니다. 이후 섹션에서 다시 컴포넌트로 돌아오겠지만, JS에 마크업을 넣는 게 익숙해지지 않는다면 이 이야기가 확신을 줄 것입니다. React는 JSX 사용이 필수가 아니지만, 대부분..
WEB개발이야기/React.js 2022. 7. 11. 0
React.js의 아주 기초적인 사용법
React를 공부하기 시작했습니다. 아주 간단한 것부터 알게 된 것을 기록해 볼까 합니다. React는 프레임워크라기보다는 라이브러리라고 할 수 있습니다. 그렇기 때문에 기존의 HTML에 간단하게 React를 적용할 수 있습니다. 먼저 가장 기본적인 HTML은 아래와 같습니다. React.js 적용하기 react.js를 적용하기 위해서 먼저 react.js javascript CDN을 적용해야 합니다. 이제 이 HTML 문서는 React를 실행시킬 수 있습니다. 간단하죠? 한번 간단하게 적용해 보겠습니다. 먼저 react가 발현될 dev를 지정합니다. 보통은 id="root"를 많이 사용하나 바꾸어도 상관없습니다. 그리고 react 문을 작성합니다. react도 javascript이므로 javascrip..
IT이야기/무료프로그램 2022. 6. 16. 0
컴퓨터 최적화 프로그램 구라제거기 사용법
컴퓨터, 특히 게임을 하다 보면 사양이 충분함에도 불구하고 자꾸 렉이 걸려서 짜증이 나는 경우가 있습니다. 그럴 경우 해결하는 방법이 여러 가지가 있지만 그중에서 컴퓨터에 불필요하게 설치되는 보안 프로그램들도 한몫합니다. 은행이나 관공서 웹사이트에 접속을 하게 되면 키보드 보안 프로그램부터 다양한 프로그램들이 자동으로 설치가 됩니다. 그 웹사이트에서 일을 볼 때는 필요하겠지만 그 일이 끝난 다음에서는 그냥 컴퓨터의 리소스를 잡아먹는 민폐 프로그램이 되어 버립니다. 그런 민폐 프로그램들을 삭제해 주는 최적화 툴이 구라제거기 입니다. 구라제거기 설치법 이름이 좀 구리지만, 저는 이런 이름 좋아합니다. 너무~ 한국적이야.. 먼저 개발자님의 블로그 사이트로 이동을 합니다. 티스토리 블로그를 사용해서 배포를 하고..
IT이야기/Google프로그램 2022. 6. 9. 0
Google캘린더(달력)에 대한민국 휴일 표시하기
구글 캘린더에 대한민국 휴일을 표시하는 설정에 대해서 소개합니다. 네이버 달력이라면 그냥 기본으로 나오겠지만 구글캘린더의 경우는 별도의 설정을 해 주어야 합니다. 휴일의 표시는 각 나라의 휴일을 구글에서 미리 작성해 놓은 것을 내 캘린더에 불러와 적용하는 방식으로 되어 있습니다. 대한민국 공유일 표시하기 먼저 설정화면으로 이동합니다. 캘린더 화면의 우측상단의 설정 아이콘을 클릭합니다. 메뉴 중 설정을 클릭합니다. 설정화면 중 좌측 메뉴에서 캘린더 추가 메뉴를 선택합니다. 관심분야와 관련된 캘린더를 선택합니다. 지역 공휴일의 모두 둘러보기를 선택하면 각나라의 휴일을 선택할 수 있습니다. 우리는 대한민국의 휴일을 선택합니다. 캘린더에서 공휴일 보기 대한민국 휴일에 대한 설정을 했다면 이제 보기 좋게 표시하면..
IT이야기/Google프로그램 2022. 6. 9. 0
Google캘린더(달력)에 음력 표시하기
구글의 서비스 중 캘린더는 매우 유용한 무료 서비스 입니다. 무엇보다도 안드로이드를 사용한다면 구글캘린더는 더할나위 없는 일정관리 툴이라 할 수 있습니다. 폰, 태블릿, 데스크탑 등 대부분의 디바이스에서 실시간 동기화도 됩니다. 다만 구글 캘린더의 한가지 아쉬운점이라면 전세계를 대상으로 하다보니 아무래도 인터페이스 면에서 한국에 최적화 되어 있지는 않다는 것입니다. 캘린더의 서드파티로 어느정도 커버는 가능하지만 약간 아쉬운 점은 어쩔 수 없습니다. 음력 표시하기 그래도 다행히 음력의 표시는 서드파티없이 기본기능으로 설정이 가능해서 설명을 해 볼까 합니다. 설정하기 ▲ 먼저 캘린더의 우측 상단에 있는 톱니모양 아이콘을 클릭합니다. 메뉴중 설정 메뉴를 선택합니다. 보조캘린더를 한국으로 선택하면 날짜 옆에 음..
IT이야기/맥북 2022. 3. 24. 0
맥북 한영 전환키를 윈도우처럼 변경하는 방법
윈도우를 사용하다가 맥 OS로 넘어가게 되면 당장 키보드 사용에서 불편함을 겪게 됩니다. 앞으로 맥 OS만 계속 사용한다면 맥 OS의 한영 전화키인 Command + Sppace 버튼을 사용하거나 키보드의 왼쪽에 있는 한/A키를 익숙하게 사용하면 됩니다. 하지만 저같이 윈도즈와 맥 OS를 번갈아 사용할 경우는 맥 OS의 한영 전환키를 윈도우즈의 키처럼 스페이스바 옆에 있는 command버튼으로 변경하는 것이 편리합니다. 한영 전환키를 기본 시스템에서는 변경할 수 없고 Karabiner라는 유틸리티 프로그램의 도움을 받아야 합니다. 먼저 https://karabiner-elements.pqrs.org 에 접속을 합니다. 다운로드 및 설치하기 자신의 OS 버전에 맞는 설치 파일을 다운로드하고 설치를 합니다...
IT이야기/맥북 2022. 2. 24. 0
MacOS의 현재 프로세스 보기와 강제종료하기
맥북을 사용하다 보면 가끔씩 사용하는 프로그램이 죽어버리는 경우가 있어요. 이게 맥OS에서만 발생하는 것은 아니고 윈도 OS에서도 발생하는데, 윈도를 주로 사용하는 저로서는 쉽게 해결할 수 있으나 MacOS에서는 어디를 어떻게 손봐야 할지 난감한 경우가 생기더라고요. 그래서 MacOS에서 현재 진행되고 있는 프로세스가 무엇이 있으면 자원은 얼마나 잡아먹고 있는지 보는 방법과 그 프로세스를 강제로 종료시키는 방법을 말해 보려고 해요. 증상 저는 이전에 Docker를 맥북에 설치를 했는데, 어느 순간부터 컴퓨터를 켜면 이 Docker가 실행은 되는데 정상적으로 실행이 되지 않고 에러를 뱉어 내고 있었어요. exit버튼을 아무리 눌러대도 종료가 안돼요. 그래서 찾아봤습니다. 해결 방법 윈도에서는 작업관리자라고..
WEB개발이야기/VScode 2022. 2. 21. 1
[VScode 익스텐션] Visual Studio Code에서 클립보드에 저장된 Image 붙혀넣기 - Paste Image
마크다운(Markdown)으로 글쓰기를 할 때 이미지 붙여넣기에 대해 매우 유용한 익스텐션이 있어서 소개해 드릴게요. 캡처 프로그램으로 캡처를 하고 바로 마크다운 문서에 붙여넣기 하면 바로 이미지가 반영이 되고 이미지는 별도의 폴더에 저장이 되도록 구성되어 있어요. [Extension] Paste Image 이미지를 클립보드에서 마크다운/asciidoc(또는 다른 파일)로 붙여넣기를 할 수 있어요. Paste Image 설정하기 Paste Image를 몇 가지 설정하면 나에게 맞게 커스터 마이징 할 수 있어요. 모든 부분을 설명하기는 어렵고, 간단하게 몇 가지 설정하는 방법입니다. Base Path : 기본이 되는 폴더의 경로입니다. 입력값은 ${currentFileDir} 및 ${projectRoot}..
WEB개발이야기/VScode 2022. 2. 18. 0
Visual Studio Code에서 코드조각(Snippets)을 슬기롭게 사용하는 방법
Visual Studio Code (이하 VS code) 자체만으로도 매우 훌륭한 툴이지만 코드 조각(Snippets)을 잘 활용한다면 더 쉽고 빠르게 코딩을 할 수 있어요. 코드 조각(Snippets)이라고 하면 핸드폰의 단축키처럼 특정 문자를 입력하면 그에 해당하는 코드가 자동으로 작성이 되는 것을 말해요. 저는 주로 Markdown으로 티스토리나 구글 블로거로 포스팅할 때 주로 사용해요. 기본 구성을 자동으로 해주기 때문에 상당히 편하죠. 내장 코드 조각 (Built-in snippets) 먼저 VS code를 설치하면 기본으로 설치되어 있거나 스니펫 익스텐션을 설치하면 사용할 수 있는 코드 조각들이 있어요. 이것만으로도 상당히 편리한 코드 생활이 가능하죠. 예를 들면 위의 애니메이션 이미지처럼 h..
WEB개발이야기/VScode 2022. 2. 17. 0
VScode(Visual Studio Code)소개와 설치하기
코딩을 하기 위한 편집기라면 TextEditor과 IDE로 나뉠 수 있을 거예요. 그중에 IDE는 특수한 환경이나 언어에 특화된 에디터라 매우 편리한 점은 있지만 범용적으로 사용할 수는 없는 거예요. 하지만 텍스트 에디터는 html, css, javascript, typescript, python, Markdown, C 등등.. 다양한 환경이나 언어에서 범용적으로 사용할 수 있기 때문에 나름 인기가 높습니다. 라떼~ 개발자라면 울트라 에디터, 에디트 플러스, 노트패드 등등.. 을 아실 텐데요. 이 텍스트 에디터의 현재 버전이 Visual Studio Code라고 할 수 있어요. 윈도의 메모장, 위드 패드 등이 1세대, 울트라 에디터, 에디트 플러스 등이 2세대라면 서브라임텍스트(Sublime Text),..
WEB개발이야기/Git 2022. 2. 11. 0
error: RPC failed; curl 18 transfer closed with outstanding read data remaining이 발생했을 때 문제해결
git을 이용하여 Clone 하는 도중.. error: RPC failed; curl 18 transfer closed with outstanding read data remaining 에러가 발생했다면 이렇게 한번 해보세요. 문제 원인 error: RPC failed; curl 18 transfer closed with outstanding read data remaining를 해석해 보면 미해결 읽기 데이터가 남아 있는 상태에서 curl 18 전송이 종료되었습니다. 라는 뜻이네요. 문제의 원인은 네트워크의 문제로 인해 연결이 끊기고 git clone 종료된 상황이라고 합니다. 보통 네트워크 상황이 좋지 않고 대량의 파일을 Clone 할 때 발생할 수 있다고 합니다. 해결 방안 한 번에 모든 파일을 g..
VSCODE 블로그포스팅/블로그포스팅 설명서 2022. 2. 10. 0
[nJo2] markdown blogPosting for vsce의 구매정보 등록 방법
[nJo2] markdown blogPosting tistory-blogger for vsce 소개 바로가기 Visual Studio Code의 익스텐션인 [nJo2] markdown blogPosting for vsce로 블로그에 글을 쓰기 위해서는 제품을 구매하고 획득한 Product ID와 CODE를 제품에 등록/설정을 해야 합니다. 그 설정하는 방법은 아래와 같습니다. 1. 구매하기 [구매자] 판매 사이트에 접속을 합니다. https://shop.njo2.com 접속하기 ▲ 상품 중 VScode Markdown으로 Blogger 글쓰기 또는 VScode Markdown으로 Tistory 글쓰기를 선택하고 구매 합니다. [구매자] 입금을 합니다. 구매를 하면 MY > 구매리스트에 구매 목록과 입금 ..
VSCODE 블로그포스팅/블로그포스팅 공지사항 2022. 2. 10. 0
[nJo2] markdown blogPosting for vsce 소개
The Buggles의 video killed the radio star ~~ 라는 노래가 생각납니다. 유튜브에 밀려 블로그 포스팅이 점차 설자리를 잃어가고 있으나 그래도 아직도 라디오가 존재하듯 상당 기간 글로 이루어진 블로그도 존재할 것입니다. 티스토리 블로깅을 하시는 분들이라면 요즘 티스토리의 움직임이 너무 없어서 다들 티스토리의 안위가 걱정이 되실텐데요. 네이버로 옮겨야 하나? 구글 블로거로 옮겨야 하나?... 고민이 많으실것 같습니다. 네이버는 유입량은 많으나 애드센스를 못달고, 블로거는 애드센스를 달 수는 있으나 사용법이 너무 불친절하고... 이런 불안함 속에서 최선의 방법은 일단 블로그를 운영하면서 최대한 내 컨텐츠를 확보하고 보호하자 였습니다 또한 더불어 편하게 컨텐츠를 등록하자 였습니다...
VSCODE 블로그포스팅/블로그포스팅 설명서 2022. 2. 10. 0
config-tistory.js 설정파일 작성 방법 - [nJo2] markdown blogPosting tistory-blogger for vsce
[nJo2] markdown blogPosting tistory-blogger for vsce 소개 바로가기 [nJo2] markdown blogPosting xxxxx for vsce을 설치하게 되면 아래 1개 또는 2개의 파일에 대해 설정을 해줘야 합니다. .vscode > config-tistory.js : 티스토리에 대한 설정을 하는 파일 .vscode > config-blogger.js : 구글 블로거에 대한 설정을 하는 파일 이 중에 이 포스팅에서는 .vscode > config-tistory.js 설정에 대해서 자세히 설명을 하려고 합니다. 먼저 아래의 전체 코드를 보여드리고 하나씩 부분 부분 설명을 하도록 하겠습니다. 전체 코드 // config-tistory.js module.export..
VSCODE 블로그포스팅/블로그포스팅 설명서 2022. 2. 10. 0
Tistory API 생성하는 방법
[nJo2] markdown blogPosting tistory-blogger for vsce 소개 바로가기 티스토리에 원격으로 글을 쓰기 위해서는 API를 사용해야 하는데 그냥 API를 사용하는것이 아니라 티스토리 측에 API를 사용하겠다고 승인을 받아야만 사용이 가능합니다. 여기서는 티스토리 API를 승인받는 방법에 대해서 작성을 하려고 합니다. 일단 티스토리에 가입이 되었다는 가정입니다. 티스토리 API 신청하기 로그인을 먼저 합니다. 티스토리 화면의 하단 Footer영역에 보면 오픈API라는 메뉴가 있는데 이 메뉴를 클릭합니다. 오픈API URL : https://www.tistory.com/guide/api/manage/register 앱등록 먼저 오픈 API를 사용하겠다는 요청을 아래와 같이 ..
VSCODE 블로그포스팅/블로그포스팅 설명서 2022. 2. 10. 0
config-blogger.js 설정파일 작성 방법 - [nJo2] markdown blogPosting tistory-blogger for vsce
[nJo2] markdown blogPosting tistory-blogger for vsce 소개 바로가기 [nJo2] markdown blogPosting for vsce을 설치하게 되면 아래 1개 또는 2개의 파일에 대해 설정을 해줘야 합니다. .vscode > config-blogger.js : 구글 블로거에 대한 설정을 하는 파일 .vscode > config-tistory.js : 티스토리에 대한 설정을 하는 파일 이중에 이 포스팅에서는 .vscode > config-blogger.js 설정에 대해서 자세히 설명을 하려고 합니다. 먼저 아래의 전체 코드를 보여드리고 하나씩 부분 부분 설명을 하도록 하겠습니다. 전체 코드 // config-blogger.js module.exports = { /..
VSCODE 블로그포스팅/블로그포스팅 설명서 2022. 2. 10. 0
Google Blogger API 생성하는 방법
[nJo2] markdown blogPosting tistory-blogger for vsce 소개 바로가기 Blogger에 원격으로 글을 쓰기 위해서는 API를 사용해야 하는데 그냥 API를 사용하는것이 아니라 Google Blogger 측에 API를 사용하겠다고 승인을 받아야만 사용이 가능합니다. 여기서는 Blogger API를 승인받는 방법에 대해서 작성을 하려고 합니다. Blogger 가입하기 일단 먼저 Blogger에 가입을 해야 합니다. https://blogger.com 에 접속을 하고 가입을 합니다. 아래에 블로그 이름을 작성하고 Blogger을 생성합니다. Blogger API에 대한 설명이므로 Blogger에는 가입했다고 치고 다음 설명으로 넘어가겠습니다. ^^ Blogger API 신..
VSCODE 블로그포스팅/블로그포스팅 설명서 2022. 2. 10. 0
마크다운으로 VS Code를 사용하여 티스토리와 구글 블로거에 글쓰기
[nJo2] markdown blogPosting xxxxx for vsce Features 마크다운(.md)으로 티스토리 블로그와 구글 블로거에 글을 쓸 수 있게 도와주는 Visual Studio Code의 익스텐션입니다. 또한 포스팅한 글을 내 컴퓨터에 체계적으로 보관하고 관리할 수 있어서 블로그가 폐쇄되거나 다른 블로그로 옮겨 탈 때 내 콘텐츠를 그대로 활용할 수 있는 장점이 있습니다. Visual Studio Code를 사용하여 마크다운(Markdown) 글을 작성할 수 있어서 굳이 티스토리나 블로거를 열어서 글을 작성할 필요가 없습니다. 구매하기 이 익스텐션은 아래의 위치에서 구매를 할 수 있습니다. https://shop.njo2.com 구매를 하게 되면 해당 블로그에서 익스텐션 설치 파일인 ..
티스토리 스킨/T스킨 설명서 2022. 2. 10. 1
판매/구매 안내
T스킨은 티스토리에 사용할 수 있는 스킨입니다. 구매 진행 절차 [구매자] nJo2 미니샵 또는 티스토리 미니샵 에서 구매 신청합니다. [구매자] 지정된 계좌로 무통장 입금 하거나 QR코드를 활용하여 입금합니다. [판매자] 입금 확인 후 다운로드 권한을 승인합니다. [구매자] nJo2 미니샵의 MY탭 또는 티스토리 미니샵의 MY탭이나 상품의 상세보기의 다운로드 탭에서 스킨파일을 다운로드하여 사용합니다. 설치하기 스킨 설치에 대해서는 티스토리 스킨 설치하기를 참고하세요. 지원안내 저작물의 오류에 대해서는 최대한 빠른 시간에 수정하고 배포할 것입니다. 오류가 아닌 기능 추가, 코드 변경 등의 수정 요청에 대해서는 공식적으로 지원하지 않습니다. 다만 공통적으로 필요한 기능일 경우 차후 버전에 추가로 기능개발 ..
IT이야기/Google프로그램 2022. 2. 9. 0
Google 스프레드시트로 구글캘린더에 일정 연동하는 방법
저는 구글 제품을 많이 사용하는 편입니다. 제 주력 캘린더도 Google 캘린더 고요. 이번에 모임의 임원을 맡게 되면서 회원들의 생일을 캘린더에 등록해야 할 일이 생겼어요. 그냥 하나하나 등록을 하는 도중 "내가 지금 뭐하고 있나.." 라는 자괴감이 들기 시작했어요. 구글 시트에 있는 날짜 정보(생일)을 한 번에 쉽게 일괄 등록할 수는 없을까라는 생각이 뇌리를 스쳤습니다. 그래서 찾아봤더니.. 약간의 매크로 프로그램을 작성하면 가능할 것 같더라고요. 그래서 열심히 개발을 해봤습니다. 1시간이면 등록할 것을 8시간 걸려서 프로그램을 짜 봤어요. 결과적으로는 더 비효율적이었네요. ㅠㅠ 그러나... 나에게는 비효율 적이었지만 이코드를 공개하면 다른 사람에게는 큰 도움이 될 수 있겠구나 생각을 하고 코드를 공..
WEB개발이야기/Vue.js 2021. 10. 20. 0
자식 컴포넌트의 CSS(SCSS)를 정의할 수 있는 딥셀렉터(v-deep) 설정하는 방법
Vue 프로젝트를 진행하다 보면 vuetify나 quasar 등 매우 다양한 프레임워크나 컴포넌트를 사용하게 됩니다. 그러면서 그 컴포넌트를 내 Vue 프로젝트의 자식 컴포넌트로 불러와서 사용하는 경우가 있는데 그 컴포넌트를 어떻게 CSS를 적용해서 내 입맛에 맞추어 스타일을 변경하고 싶으나 그게 생각처럼 되지 않는 경우가 있습니다. 그걸 되게 하는 방법을 설명해 보려고 합니다. 자식 컴포넌트의 CSS에 쉽게 접근이 되지 않는 이유 이렇게 되는 이유는 웹 컴포넌트의 중요한 측면인 스타일 캡슐화때문이라고 합니다. 다시말해서 현재 컴포넌트에 적용된 css(scss)가 현재의 컴포넌트에만 적용되고 다른 컴포넌트에는 간섭이 되지 않도록 하기 위함이라고 보시면 됩니다. 그래서 Vue컴포넌트에서 그런데 scoped..
WEB개발이야기 2021. 6. 5. 0
Docker로 Quasar framework 개발 환경 세팅하기
Docker와 docker-compose를 사용하여 Web 또는 App을 개발하는 환경을 세팅해 보려고 합니다. 이 세팅으로 여러사람, 또는 여러 장소에서 개발, 빌드의 환경을 동일하게 가져갈 수 있습니다. 일단 Windows 환경(WSL2)에서 Docker데스크톱이 설치되어 있다는 전제 입니다. Quasar 프로젝트 초기 파일 생성하기 (스캐폴딩 - Scaffolding) 아무것도 없는 상태에서 Quasar 프로젝트를 시작하려면 먼저 스케폴딩을 파일을 가져와야 합니다. 보통 vue init나 quasar create로 생성해야 하며 이것도 Docker의 기능을 활용해서 가져오면 됩니다. 먼저 CMD창을 열고 프로젝트로 사용할 폴더를 만들고 해당 폴더로 이동합니다. # 프로젝트 폴더 생성 mkdir my..
WEB개발이야기 2021. 2. 17. 0
headless CMS인 STRAPI 설치하기
이전시간에 프론트앤드 개발자에게 꼭 필요한 백앤드를 책임질 STRAPI 라는 제목으로 소개에 대한 포스팅을 했었습니다. 이번에는 STRAPI를 설치하는 방법에 대해서 포스팅을 하려고 합니다. STRAPI 설치하기 strapi를 설치하기 위해서는 이미 컴퓨터에 npm 5.2.0이상 버전이 설치되어 있거나 yarn이 설치되어 있어야 합니다. 해당 패키지매니저를 설치하는 방법은 따로 설명하지 않겠습니다. Strapi 패키지는 yarn 또는 npx를 통해 설치할 수 있으며 여기서는 yarn으로 설치하는 방법만 작성합니다. 1. 프로젝트 폴더에 설치하기 yarn의 아래 명령어로 Strapi의 프로젝트를 설치합니다. yarn create strapi-app my-project --quickstart create s..
WEB개발이야기 2021. 2. 17. 3
프론트앤드 개발자에게 꼭 필요한 백앤드를 책임질 STRAPI
예전에는 그냥 퍼블리셔로 통칭 되었을텐데 현재는 프론트앤드 개발자라는 아주 중요한 직업군으로 형성되어 있습니다. Web개발의 패러다임이 javascript와 Node.js로 인해 백앤드에서 프론트앤드쪽으로 넘어오게 되면서 프론트앤드 기술을 구현할 수 있는 개발자의 몸값이 상당히 높아지고 있는 것이 사실입니다. 그래서 많은 사람들이 프론트앤드로 전향을 많이하고 있는 추세인데.. 그런 프론트앤드 개발자에게 한가지 걸림돌이 있습니다. 프론트앤드를 주력으로 하지만 어찌되었든 백앤드도 구비를 하고 있어야 한다는 점입니다. Firebase, Amazon, Express 등등.. 백앤드를 구비하는 여러가지 방법이 있으나 그중에서 아주 쉽고 직관적이며 무료로(유료도 있음) 사용할 수 있는 STRAPI라는 백앤드 툴이 ..
WEB개발이야기/Vue.js 2021. 1. 11. 6
Vue의 Vuetify로 대규모 프로젝트 SCSS(CSS) 진행하는 방법
안정성이 입증되었는지 요즘에는 Vue로 대규모 프로젝트를 많이 하는 추세인것 같습니다. 저도 대규모 프로젝트에 퍼블리셔로 참여하면서 얻은 경험을 기록 차원에서 포스팅을 해보려고 합니다. Vue는 하나의 파일에 구조(Template)와 구현(javascript), 표현(CSS)을 모두 다 담고 있기 때문에 풀스택(Full Stack) 개발자에게는 더할 나위 없이 편한 구조이지만 대규모 프로젝트 처럼 개발자, 디자이너, 퍼블리셔가 별도로 존재하는 경우에는 상당히 불편할 수 있는 구조를 가지고 있습니다. 개발자가 개발하는 파일을 퍼블리셔도 동일한 파일의 이번 포스팅에서는 Vue로 대규모 프로젝트를 진행할 때 퍼블리셔 관점에서 퍼블리셔와 프론트앤드 개발자와 협업을 원활히 하는 방법에 대해서 기술하려고 합니다. ..
WEB개발이야기/Git 2021. 1. 7. 0
Git 레파지토리 별로 사용자 지정하기
하나의 PC에서 여러 군데의 Git 레파지토리를 운영할 때 레파지토리 별로 사용자 이름과 이메일을 달리 사용해야 하는 경우가 있습니다. 보통은 글로벌하게 설정하여 사용하기 때문에 모든 레파지토리에서 커밋과 푸시를 하게 되면 동일한 이름이 사용되게 되어 있습니다. 모든 레파지토리에 글로벌하게 적용 아마도 대부분 글로벌하게 적용하는 이 방법은 아시리라 생각됩니다. $ git config --global user.name "이름 1" $ git config --global user.email "이메일주소 1" 하나의 레파지토리에만 적용 하지만 하나의 레파지토리에만 다른 이름과 이메일을 적용하는 방법은 잘 모르시는 경우가 있습니다. 바로 --global 을 --local로만 변경해 주면 됩니다. 원하는 레파지토..
티스토리 스킨/T스킨 설명서 2020. 11. 10. 4
티스토리 관리자 기능 중 수익 적용하기 (애드센스)
이번에 티스토리에서 카카오 로그인과 수익 기능을 업데이트 했습니다. 수익기능 중 애드센스적용에 대해서 설명하려고 합니다. 추가로 T스킨에 특화된 적용방법은 주석으로 달도록 하겠습니다. 애드센스 광고 붙히기 위한 사전 작업 애드센스를 티스토리 붙히기 위해서는 먼저 애드센스 가입(계정생성)과 승인(계정 활성화)이 완료되어야 합니다. 애드센스 계정 만들기 (가입) 구글 아이디가 있다면 바로 애드센스에 가입을 하면 되지만 없다면 구글 아이디부터 만들어야 합니다. 구글 아이디를 만들었다면 쉽게 애드센스 계정을 만들 수 있습니다. 애드센스 계정 만들기 애드센스 계정 활성화 (승인) 계정을 만들었다고 바로 광고를 달 수는 없습니다. 해당 계정이 광고를 달기에 적절한 블로그를 가지고 있는지 애드센스측에서 심사를 하게 ..
