tech11 Git 관련 - 깃헙에서 FE 웹사이트 보여주는 법 등 1. Github에서 branch 갖고 있으면 GitHub에서 공짜로 static hosting을 제공한다ㅡ static website는 오로지 front-end만 작동 가능한, HTML, CSS, JavaScript만 쓸 수 있는 걸 의미한다 2. Branch의 이름은 반드시 go-pages여야 한다, 이건 의무사항이다, 저장소는 물론 public이어야 한다, 소문자다 3. 이걸로 작업한 걸 보여줄 수 있다, 무료 웹사이트 갖고 무료 포트폴리오 갖고 있을 수 있다 4. URL은 : 유저네임.GitHub.io/리파지토리제목 5. 아니면 리파지토리 들어가서 우측 environments에서 GitHub pages 클릭하고 우측에 view deployments 누르면 된다, Awesome! 6. G.. 2024. 10. 10. HTML, CSS 기타 1. Css 에서 "box-sizing: border-box"라고 쓴 거는 padding을 디폴트로 상자 밖의 영역으로 인식하는 css한테 "내가 padding을 줘도 신경쓰지 마, 내 box 사이즈를 늘리지 말아줘"라고 한 거다 2. 닷(.)은 class를 지칭한다 3. 스크린샷을 보면서 반복되는 모양들을 component로 만들고 따로 빼면 작업하기 아주 쉬워진다 4. Html에서 주석은 로 처리한다 5. id 쓰기보다 class명이 길어져도 그렇게 BEM 테크닉 쓰길 권고한다 6. 클래스명을 "user-component__title--not-bold" 이렇게 길게 써도 된다 7. 1 이라고 쓰면 클래스가 2개 있는 것이다 8. 같은 코드가 반복된다면 var로 만들어주는 게 좋다, 똑같은 코.. 2024. 10. 8. BEM, 아이콘, css import 1. Block Element Modifier 규칙으로 코드를 짜자, 코드를 읽기가 정말 쉬워진다, 클래스가 커다래질 수 있다는 단점이 있지만 단점이 아니다, 클래스 이름을 체계적으로 지을 수 있게 된다 (BEM으로 짜는 게 나은지 id와 class를 섞어쓰는 게 나은지 스스로 판단해 봐 2. Heroicons.dev 에서 카피하고 태그 안에 넣어주면 된다, css로 모양 바꿔줄 수 있다, 무료라서 많지는 않다 3. Fontawesome.com은 유무료 다 있고 매우 좋다, code kit를 받은 다음에 프로 클릭해서 유료 결제 가능하다 스크립트 태그는 항상 바디 태그를 닫기 전 가장 마지막에 와야 한다 4. "wow I am really enjoying myself. I love thi.. 2024. 10. 2. HTML/CSS, 깃, 깃헙 1. nav>ul>li*4>a 라고 치면 VSC가 지루한 아래 HTML 코드를 숏컷으로 짜준다 2. 깃 다운받기: git-scm.com 3. 깃헙: github.com 4. 깃헙의 repositories는 코드가 사는 집이다 5. 깃헙의 commit은 '나 이 버전의 코드를 저장하고 싶어'다 6. 깃헙은 history를 볼 수 있다 7. 깃헙에서 변경된 코드를 볼 수 있는 건 깃 덕분이다, 깃헙이 도움을 주지만 변경사항을 식별해주는 건 깃이다 8. 이전 버전으로 돌아갈 수 있도록 코드관리를 해주기 때문에 매우 중요하다 9. Repository name은 소문자로 띄어쓰기 없이 만들어야 한다 10. 깃헙웹페이지에서 Repository 만들고, 데탑앱에서.. 2024. 10. 1. VSC 설치 1. 폴더 새로 만들고 VSC에서 해당 폴더를 오픈해야 함 2. 폴더명은 언제나 소문자여야 한다 3. 파일은 언제나 오픈한 폴더 내에 만들어야 하고, 파일명도 언제나 소문자여야 한다 4. 브라우저가 html과 css를 이해한다 5. VSC는 텍스트 에디터일 뿐이고 메모장으로도 html은 만들 수 있다 6. 익스텐션이 좋아서 VSC 쓰면 좋다 7. 추천 확장프로그램: community material theme(set color theme), material icon theme 8. 브라우저는 html에 에러가 있다고 말해주지 않는다, 늘 컨텐츠를 보여주려고 한다, 그래서 오류를 찾기 어렵기도 하다 9. Html은 브라우저에게 얘기를 해주기 위해 존재한다 10. VSC는 자동으로 태그를 달면 닫는 태그.. 2024. 9. 30. 이전 1 2 다음