mminky's

3) 지역저장소에서 원격저장소에 올리기

 (1) 지역저장소, 원격저장소 연결

 원격저장소에 파일을 업로드하기 위해서는 지역저장소와 원격저장소의 연결이 필요합니다.

 우선 local-rep이라는 지역 저장소에 hello.txt파일을 만들었습니다.

 그리고 hello라는 내용을 입력한 후 커밋했습니다. 

 아까 만들었던 원격저장소에 들어가면 ...or push an existing repository from the command line(커맨드라인 이용)

 방법이 적혀있습니다.

 command line을 이용한 방법을 따라 해보겠습니다!

 복사하기 버튼을 눌러서 한 번에 붙여넣어도 되지만 오늘은 직접 입력해보겠습니다.

 $ git remote add origin 복사한 주소

  : remote(원격저장소)에 origin(깃허브저장 주소)을 추가

    즉, 지역저장소를 특정 원격저장소에 연결

 * 깃의 기본 브랜치가 master인 것 처럼 기본 원격저장소는 origin 입니다.

 $ git remote -v

 git remote명령어에 -v옵션을 붙이면 origin의 주소가 나타납니다.

 아까 만들었던 원격저장소의 주소가 맞는지 확인해보세요:)

 (2) 원격저장소에 push, pull

 push : 지역저장소 -> 원격저장소

 pull :  원격저장소 -> 지역저장소

 $ git push -u origin master

 : 지역저장소의 브랜치를 원격저장소의 master브랜치(origin)에 연결

 이 명령어를 입력하면 깃 허브 로그인 창이 나타납니다! (글쓰다가 날려서 사진이 없네요 ㅠ)

 본인의 깃허브 아이디와 비밀번호로 로그인해주세요.

 만약 아이디와 비밀번호를 잘못 입력했다면

 fail되었다고 하면서 OpenSSH창이 나타납니다.

 그러면 다시 Username과 Password를 입력해봅니다!

 로그인에 성공했다면 다음과 같이 나타납니다.

 push가 성공했는지 확인하러 원격저장소에 접속합니다.

 hello.txt가 올라간 것을 볼 수 있습니다. 옆에는 최신 커밋메시지인 add hello가 적혀있네요 :)

 한 번 연결해서 push했다면 그 다음 부터는 $ git push만 입력하면 됩니다.

 아까 만들었던 hello.txt에 world를 넣어서 다시 커밋해보겠습니다.

 이번에는 git push만 입력해도 성공하는 것을 볼 수 있습니다.

 원격저장소에 들어가면 다음과 같습니다.

 최신 커밋 메시지인 add world가 적혀져 있습니다.

 그리고 2 commits를 클릭해보면 다음과 같이 커밋 이력이 나타납니다.

 또한 hello.txt를 클릭하면 내용을 볼 수 있습니다.

 * 깃허브 사이트에서 바로 commit 하기

 : Create new file -> 파일명&내용 입력 -> 커밋메시지&설명 입력 -> Commit new file

 $ git pull origin master

 : 원격저장소 -> 지역저장소 가져오기

 우선 깃허브 사이트에서 test2.txt파일을 만들었습니다.

 즉, 원격저장소에는 test.txt와 test2.txt가 있고, 지역저장소에는 test.txt만 있는 상태입니다.

 git pull origin master명령어로 원격저장소에 있는 파일을 가져옵니다.

 이때, 기본적으로 원격저장소는 master이고 지역저장소의 브랜치가 master이기 때문에 git pull만 입력해도 무방합니다.

 $ git log를 해보니 깃허브에서 커밋한 이력이 함께 나타납니다.

또한, $ ls 명령어로 지역저장소인 local-rep에 hello2.txt도 포함된 것을 알 수 있습니다.

3) 깃허브에 SSH 원격 접속

 SSH : Secoure SHell의 약자로 보안된 방법으로 정보를 교환하는 방식입니다.

 좌물쇠 역할의 퍼블릭 키와 열쇠 역할의 프라이빗 키가 생성됩니다.

 우선, 퍼블릭 키를 깃허브 서버로 전송해 저장합니다. 그리고 깃허브에 접속해 사용자가 가진 프라이빗 키(열쇠)를

 퍼블릭키와 맞춰봅니다. 맞다면 사용자 컴퓨터와 깃허브 저장소가 연결됩니다.

 (1) 보안키 생성

 $ ssh-keygen

  : 보안키를 생성합니다.

 파일 이름을 입력하라고 하는데 저는 그냥 Enter키를 누르겠습니다.

 그리고 passphrase가 필요하면 입력하라고 하는데 저는 입력하지 않겠습니다.

 위와 같이 ~/.ssh에 프라이빗키(id_rsa)와 퍼블릭키(id_rsa.pub)가 생성된 것을 확인 할 수 있습니다.

 (2) 깃허브에 퍼블릭 키 전송

 $ cat id_rsa.pub 명령어를 입력하면 퍼블릭키의 내용이 나옵니다. 나타난 내용을 복사합니다.

 이때 불필요한 빈 칸, 빈 줄은 최대한 포함시키지 않습니다.

 깃허브 -> 사용자아이콘 클릭 -> Settings 선택

 SSH and GPG Keys -> New SSH Key 선택

 퍼블릭 키는 여러개를 등록 할 수 있습니다.

 따라서 알맞은 이름을 붙여서 저장합니다.

 그리고 Key 칸에 아까 복사해두었던 키를 붙여넣고 Add SSH Key 버튼을 클릭합니다.

 그러면 비밀번호 확인 창이 나타납니다. 깃허브의 비밀번호를 입력한 후 Confirm Password를 클릭합니다.

 (3) SSH 주소로 원격저장소 연결

 이번에는 ssh로 연결하기 위해 새 저장소를 만들었습니다.

 그리고 이번에는 https 대신 ssh를 선택한 후 ssh주소를 복사합니다.

 $ git remote add origin 복사한 주소

  : 방법은 https 주소와 동일합니다. 아까 복사해뒀던 ssh 주소를 붙여넣습니다.

 홈 디렉터리에 local-with-ssh라는 새 지역저장소를 생성합니다.

 local-with-ssh 디렉터리로 이동 후 git remote add origin 명령어를 입력합니다.

 git remote -v 명령어로 확인을 하면 끝!!

---------------------------------------------------------------------------------------------------

본 글은 Do it! 깃&깃허브 입문 책을 참고하여 작성하였습니다.

https://book.naver.com/bookdb/book_detail.nhn?bid=15910099

1) 깃허브란

깃허브는 인터넷에서 제공하는 원격 저장소입니다.

원격저장소는 지역저장소(본인의 컴퓨터)가 아닌 컴퓨터나 서버에 만든 저장소를 뜻합니다.

특히 백업, 협업을 할 때 유용합니다.

깃허브는 대부분의 개발자가 이용하고 있고, 오픈소스가 많이 올라와있기 때문에

개발자라면 아주 유용한 서비스입니다.

아직 가입하지 않으신 분은 아래 게시글 참고해서 가입해주세요:)

https://mminky.tistory.com/9

-----------------------------------------------------------------------------------------------------------------------------------

2) 원격 저장소(repository) 만들기

깃허브에 로그인 후 '+'버튼을 누르면 아래 사진과 같은 메뉴가 나타납니다.

새 저장소를 만들기 위해 'New repository'를 선택합니다.

위의 예시처럼 필요한 항목을 입력 후 Create repository 버튼을 클릭합니다.

Initialize this repository with a README는 저장소 소개를 작성하는 readme파일을 기본으로 만들어준다는 뜻 입니다.

(책에서는 readme파일을 나중에 공부하기 때문에 체크하지 않았습니다.)

Add.gitignore은 깃에서 무시할 언어를 선택하는 것 입니다. ( 어떤 것을 .gitignore에 넣을지 )

저장소가 다 만들어지면 위와 같이 https주소가 나타납니다.

옆에 있는 버튼(아래 사진 첨부)을 클릭하면 주소를 쉽게 복사할 수 있습니다.

제 저장소 주소는 https://github.com/mmingyy/doit-git.git 이네요 :)

[ 깃허브 공동 작업자 collaborator 추가 ]

Settings -> Manage access -> Invite a collaborator -> 이메일/닉네임 입력해서 추가!

---------------------------------------------------------------------------------------------------

본 글은 Do it! 깃&깃허브 입문 책을 참고하여 작성하였습니다.

https://book.naver.com/bookdb/book_detail.nhn?bid=15910099

[home.page.html]

<ion-header>
  <ion-toolbar>
    <ion-title>
      open_page
    </ion-title>
  </ion-toolbar>
</ion-header>

<ion-content padding>
  <ion-button (click)="openWebpage()">open_page</ion-button>
</ion-content>

[home.page.ts]

import { Component } from '@angular/core';
import {InAppBrowser, InAppBrowserOptions} from '@ionic-native/in-app-browser/ngx'
@Component({
  selector: 'app-home',
  templateUrl: 'home.page.html',
  styleUrls: ['home.page.scss'],
})
export class HomePage {
  constructor(private iab: InAppBrowser,) {}
  
  openWebpage(){
    const url = 'https://www.google.co.kr/';
    const options: InAppBrowserOptions = {
      zoom: 'yes'
    }
    //opening a URL and returning an InAppBrowserObject
    const browser = this.iab.create(url,'_self',options);
  }
}

[app.module.ts]

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { RouteReuseStrategy } from '@angular/router';

import { IonicModule, IonicRouteStrategy } from '@ionic/angular';
import { SplashScreen } from '@ionic-native/splash-screen/ngx';
import { StatusBar } from '@ionic-native/status-bar/ngx';

import { AppComponent } from './app.component';
import { AppRoutingModule } from './app-routing.module';
//in-app-browser import
import { InAppBrowser } from '@ionic-native/in-app-browser/ngx';
@NgModule({
  declarations: [AppComponent],
  entryComponents: [],
  imports: [BrowserModule, IonicModule.forRoot(), AppRoutingModule],
  providers: [
    StatusBar,
    SplashScreen,
    { provide: RouteReuseStrategy, useClass: IonicRouteStrategy },
    InAppBrowser, //add
  ],
  bootstrap: [AppComponent]
})
export class AppModule {}

[결과]

open_page라는 파란 버튼을 클릭하면

구글 사이트가 나타난다.

* 혹시 버튼을 클릭하지 않고 바로 웹사이트를 띄울 수 있는 방법을 아시는 분은 댓글 부탁드려요!!


※ 제 글이 도움이 되었다면 공감 부탁드려요 :)

이전 프로젝트를 하다가 새 프로젝트를 시작하면

remote(원격저장소)의 origin 주소를 수정해야 합니다.

* 기존의 origin 제거

git remote remove origin

* 새 origin 추가

git remote add origin https://github.com/계정/저장소주소.git

그리고 commit, push origin master하면 잘 실행됩니다 :)

상태바 맨 우측 하단의 버튼을 클릭합니다.

-> 야간 모드 선택(보이지 않으면 '확장'선택하면 보임)

[React Native]

https://www.youtube.com/watch?v=cRhHBpYK8I4&list=PL7jH19IHhOLPEhP6oPSgK6r-neUVVA-pi&index=1

react native로 날씨앱을 만들어보는 과정 입니다.

react js 강좌를 듣고 들으면 더 이해하기 쉽습니다.

한글 자막이 잘 되어있어서 추천합니다 :)

[Ionic]

https://www.youtube.com/watch?v=8jxtycBwoTw&list=PL7hySDKlnYfsy5sR3c6XNZLoDGm7Irq7K&index=1

2019년 9월 강의라서 약간의 차이가 있습니다.

하지만 설명을 질리지 않을 말큼 끊어서 하시기 때문에

이해도 잘 되고 추천합니다!

git clone과 git pull 둘 다 원격저장소에서 로컬저장소로 가져오는 것은 맞습니다.

하지만 git clone은 local에 아무것도 없는 상태에서 원격저장소의 데이터를 가져오는 것을 의미합니다.

그리고 git pull은 local에 이미 있고, 원격저장소의 수정상태를 반영하기 위해 하는 것 입니다.

항상 수정 전 git pull 잊지마세요!!

https://openweathermap.org/

우선 회원가입을 해야합니다.

sign in -> Create an Account

사용자이름/

이메일/

비밀번호/ 비밀번호 확인

입력 후 아래 두 개의 약관을 체크 한 후 가입하면 됩니다 :)

로그인을 한 후 username을 클릭합니다.

그리고 API keys라는 탭을 클릭하면 끝!