Github

Github? 깃허브는 분산 버전 관리 툴인 깃저장소 호스팅을 지원하는 웹 서비스이다. 루비 온 레일스로 작성되었다. GitHub는 영리적인 서비스와 오픈소스를 위한 무상 서비스를 모두 제공한다. 2009년의 Git 사용자 조사에 따르면 GitHub는 가장 인기있는 Git 저장소 호스팅 서비스이다. 1. Github 가입, 프로젝트 생성하기 1-1. https://github.com/ 에 접속하여 회원가입 후 로그인한다 1-2. 사이트 좌측 상단에 있는 [New repository] 를 클릭 1-3. Repository name 칸에 저장소의 이름을 적고, Description 칸에 저장소에 대한 간략한 설명을 적음 public : 원격 저장소에 올라갈 소스가 무료(오픈소스) private : 원격 저장..

2022.03.03

Git

Git 깃(Git)은 컴퓨터 파일의 변경사항을 추적하고 여러 명의 사용자들 간에 해당 파일들의 작업을 조율하기 위한 분산 버전 관리 시스템이다. Git Working Flow - 작업 흐름 여러분의 로컬 저장소는 git이 관리하는 세 그루의 나무로 구성되어 있습니다. 첫번째 나무인 작업 디렉토리(Working directory)는 로컬(실제) 파일들로 이루어져있고, 두번째 나무인 인덱스(Index)는 준비 영역(staging area)의 역할을 하며, 마지막 나무인 HEAD는 최종 확정본(commit)을 나타냅니다. VScode를 이용한 Git 초기 세팅 1. 먼저 https://git-scm.com/ 사이트에서 Git을 설치한다. 2. 로컬 저장소가 될 폴더를 만든다. ex) D:\git_sample\..

2022.03.02

Service worker Navigation PreLoad

유튜브 동영상 iframe을 사용하게 되면 아래와 같은 에러메세지가 뜬다 The service worker navigation preload request was cancelled before 'preloadResponse' settle. If you intend to use 'preloadResponse', use saitUntil() or responWith() to wait for the promise to settle. 아래 코드를 head에 삽입하면 해결~ 서비스 워커 Navigation Preload 에러 메시지 Chromium 기반 브라우저에서 서비스 워커 navigationPreload 배관을 사용하지 않고 사전 로드 브라우저 힌트를 사용하는 경우 브라우저 콘솔에 다음 오류 메시지가 표시될..

2022.01.21

SNS API 연동

각 SNS 서비스에서 제공하는 개발자 사이트를 통해 API코드를 받아, 홈페이지에 삽입해주면 된다 페이스북 https://developers.facebook.com/docs/plugins/page-plugin 페이지 플러그인 - 소셜 플러그인 - 문서 - Facebook for Developers 페이지 탭: 타임라인, 이벤트, 메시지 이제 플러그인에 타임라인, 이벤트, 메시지 탭이 생깁니다. 타임라인 탭: Facebook 페이지 타임라인에 올라온 최신 게시물을 표시합니다.이벤트 탭: 사용자가 developers.facebook.com 트위터 https://publish.twitter.com/# Twitter Publish publish.twitter.com

2021.12.22

웹 개발을 하기 위한 PC 세팅

웹개발을 하기 위해서 PC에 아래 3가지 세팅이 필요하다. 1. 가상서버(버추얼 서버) 설치 - 본인 PC의 특정 폴더를 서버로 만든다. (Arpache 가상서버) 2. 데이터 베이스 설치 (MySQL) 3. php 설치 (사용할 웹 개발 언어) 위 3가지를 합쳐 AMP 이라고 한다 (Arpache, mySQL, php) 3가지를 한번에 설치해주는 XAMPP라는 개발 도구가 있다. XAMPP 다운로드 및 설치 후 언어설정을 위해 UTF-8 세팅을 해줘야 한다. XAMPP 다운로드 및 설치 위 3가지를 한번에 설치해주는 XAMPP 개발도구가 있다. 아래 사이트에서 다운로드 할 수 있다. 무조건 최신 버전을 설치하면 안되고 호스팅 버전에 맞춰 설치해야 한다. XAMPP Windows > 5.6.40 버전 설..

2021.12.13

오픈그래프(Open Graph) 메타태그(meta tag)

open graph 태그란? - 페이스북이나 네이버 블로그, 카카오톡 등에서 링크를 공유하면 자동으로 링크에 대한 미리보기 제목, 설명, 이미지를 제공하게 되는데, 이를 제어할 수 있는 태그 - 오픈그래프 프로토콜은 페이스북에 의해서 처음 만들어 짐 - 오픈그래프는 HTML문서의 메타정보를 쉽게 표시하기 위해 만들어짐 - 메타정보에 해당하는 제목, 설명, 문서의 타입, 대표 URL등 다양한 요소들에 대해서 사람들이 통일하여 쓸 수 있도록 정의해 놓은 프로토콜임. open graph 작동원리 1. 사용자가 링크를 입력창에 입력 2. 페이스북, 네이버 블로그, 카카오톡은 입력창의 문자열이 '링크'라는 것을 파악함 3. 링크라는 것이 파악되면 페이스북, 네이버 블로그, 카카오톡의 크롤러는 미리 그 웹사이트를 ..

2021.11.16