Notice
Recent Posts
Recent Comments
Link
«   2024/10   »
1 2 3 4 5
6 7 8 9 10 11 12
13 14 15 16 17 18 19
20 21 22 23 24 25 26
27 28 29 30 31
Archives
Today
Total
관리 메뉴

한바다

리액트 로고변경,깃에 100MB 파일 올리기 본문

React

리액트 로고변경,깃에 100MB 파일 올리기

한바다진화 2024. 8. 27. 18:53

☑️ 리액트 로고 변경

리액트 로고 변경은 public > index.html에서 진행한다

[변경전 화면]

 

[변경전 코드]
public > index.html
<head>
  <meta charset="utf-8"/>
  <link rel="icon" href="%PUBLIC_URL%/logo192.png" />
   <meta name="description"  content="Web site created using create-react-app"/>
   <title>React</title>

 

<link rel="icon" href="%PUBLIC_URL%/logo192.png" /> -> 이 부분에 로고를 실시간으로 변경하기 위해서

png파일을 ico로 변경한다!! 파일을 변환해주는 사이트는 아래 두곳이 있다!

https://convertio.co/kr/png-ico/

 

PNG ICO 변환 (온라인 무료) — Convertio

png 파일(들) 업로드 컴퓨터, Google Drive, Dropbox, URL에서 선택하거나 이 페이지에서 드래그하여 선택해 주세요.

convertio.co

https://cloudconvert.com/png-to-ico

 

PNG to ICO | CloudConvert

Compress Merge Capture Website Create Archive Extract Archive Convert PNG Converter PNG PNG or Portable Network Graphic format is a graphic file format that uses lossless compression algorithm to store raster images. It uses 2 stage compression methods. It

cloudconvert.com

[변경 후 화면]

[수정된 코드]
<head>
    <meta charset="utf-8" />
    <link rel="icon" href="%PUBLIC_URL%/chicken_logo.ico" />
     <meta name="description" content="chicken-store" />
     <title>아는맛집치킨집</title>

 

☑️ Git hub에 100mb파일 올리는 방법

git hub에 100mb파일을 올릴 경우 에러가 나는데 아래와 같은 방법으로 진행시 파일이 올라갈 수 있다.

[사용된 명령어]
git add .
git commit -m "100Mb error"
git push

그리고 나서 아래링크로 큰파일 저장소 다운로드를 진행한다.

https://git-lfs.com/

 

Git Large File Storage

Git Large File Storage (LFS) replaces large files such as audio samples, videos, datasets, and graphics with text pointers inside Git, while storing the file contents on a remote server like GitHub.com or GitHub Enterprise.

git-lfs.com

다운로드를 진행하고 나면 cmd창을 껏다가 다시 키고 아래 명령어를 입력한다.

C:\Users\user1\Spring-React-Workspace>git lfs install
Updated Git hooks.
Git LFS initialized.
-> Git LFS를 설치하고 초기화, LFS는 큰파일을 Git저장소에서 관리할 수 있도록 도와주는 확장
-> 명령어 실행 후 Updated Git hooks."와 "Git LFS initialized."라는 메시지가 나타남
C:\Users\user1\Spring-React-Workspace>git log
-> git log명령어는 현재 브랜치의 커밋 기록을 표시
C:\Users\user1\Spring-React-Workspace>git reset --hard HEAD~1
-> 현재 커밋(HEAD)을 이전 커밋(HEAD~1)으로 되돌리는 명령어, --hard 옵션을 사용하면 현재작업 파일들도 해당 커밋 상태로 돌아감
-> 현재상태가 이전 커밋으로 완전히 되돌아가 이후 모든 변경사항은 삭제되며, 되돌아간 커밋이 현재 HEAD가 된다
C:\Users\user1\Spring-React-Workspace>git log
C:\Users\user1\Spring-React-Workspace>git rm --cached *
-> 현재 디렉토리에 있는 모든 파일을 Git의 인덱스에서 제거한다.

 

[Git을 사용하여 로컬과 원격저장소간에 브랜치와 커밋을 관리하는 과정]

git log

-> 현재 브랜치의 커밋 기록을 보여준다

git reset --hard 4cdf8ec383fc8edc602b0a7c3080c83d81f75ffe

-> `HEAD`를 `4cdf8ed` 커밋으로 되돌린다. --hard` 옵션을 사용했기 때문에 파일상태도 해당 커밋 상태로 완전히 

     되돌아 간다

git push

-> 로컬 저장소의 변경사항을 원격 저장소로 푸시

git reset --hard d7da403c796cd66cbd768caccd4d3bfd3d345ff6

-> `HEAD`를 `d7da403` 커밋으로 되돌린다. 

git push -f

-> `-f` 옵션을 사용하여 강제로 푸시를 수행한다. `git push -f'는 로컬브랜치의 상태를 원격 브랜치에 덮어쓰는 것으로  

     원격 저장소의 변경사항을 무시하고 로컬의 내용을 강제로 푸시한다.

▶ `git reset --hard` 명령어를 사용하여 과거의 커밋으로 되돌아 간다. `git push -f` 명려어로 강제로 로컬의 커밋을

     원격 저장소에 푸시하여 원격 브랜치가 로컬가 동일하게 되도록 업데이트!