Github 시작하기

2023. 3. 29. 19:06

github는 코드를 게시하는 곳이다. 코드의 버전을 관리할 수 있고, 포트폴리오로 사용된다. 협업을 위한 공간이 된다. github에 코드를 올리기 위해서는 GIT을 설치해야한다. 웹에 코드를 올리기 위해서는 GIT 코딩을 통해서 업로드 할 수 있다. 그래서 hub에 내 코드를 올리고 싶으면, git을 설치해야한다. 주절주절

1. 계정 생성 및 로그인

GitHub: Let’s build from here

GitHub is where over 100 million developers shape the future of software, together. Contribute to the open source community, manage your Git repositories, review code like a pro, track bugs and fea...

github.com

2. Git 설치,

설치 할 때 그 넥스트 넥스트 넥스트 함.

Git

git-scm.com

3. Git 설치 후 환경설정

4. repository 생성

위 사진에 있는 코드들은 코드를 hub에 보낼때 git에 쳐야하는 명령어들임.

5. 코드 업로드

- 예시 코드, html 파일

<html>
    <head>
        <meta charset="UTF-8">
        <title>로그인 박스</title>
        <style>
                th{
                    width: 50px;
                }
                td{
                    width: 50px;
                }
            </style>
    </head>
    <body>
        <fieldset>
        <table>
            <tr><!--행(row)선언-->
                <th ><b>ID</b></th>
                <th><input type="text" name = "UserID" value=""placeholder = "아이디를 입력 해주세요."/></th>
                <th rowspan="2"><input type="submit" value="로그인"/></th>
            </tr>
            <tr><!--행(row)선언-->
                <th><b>PW</b></th>
                <th><input type="password" name = "UserPW" value=""placeholder = "비밀번호를 입력 해주세요."/></th>
            </tr>
            <tr><!--행(row)선언-->
                <th colspan="3">
                    <a href="join.html" data-role="button">회원가입</a>
                    <input type="button" value="아이디/비번 찾기">
                </th>
            </tr>
        </table>
        </fieldset>

    </body>
</html>

<html>
    <head>
        <meta charset="UTF-8">
        <title>회원가입 페이지</title>
        <style>
            td{
                width: 300px;
            }
        </style>
    </head>
    <body>
        <fieldset>
        <h2>회원가입</h2>
        <hr/>
        <table>
            <tr>
                <th>아이디</th>
                <td><input type="text" name = "UserID" value=""/></td>
            </tr>
            <tr>
                <th>비밀번호</th>
                <td><input type="text" name = "UserPW" value=""/></td>
            </tr>
            <tr>
                <th>비밀번호 확인</th>
                <td><input type="text" name = "ReUserPW" value=""/></td>
            </tr>
            <tr>
                <th>이름</th>
                <td><input type="text" name = "Name" value=""/></td>
            </tr>
            <tr>
                <th>이메일</th>
                <td><input type="email" name="mail" required/></td>
            </tr>
            <tr>
                <th>생년월일</th>
                <td>
                    <select name="year">
                        <option value="1995">1995</option>
                        <option value="1996"d>1996</option>
                        <option value="1997" selected>1997</option>
                        <option value="1998">1998</option>
                        <option value="1999">1999</option>
                        <option value="2000">2000</option>
                    </select>
                    <select name="month">
                        <option value="01" selected>01</option>
                    </select>
                    <select name="day">
                        <option value="01" selected>01</option>
                    </select>
                </td>
            </tr>
            <tr>
                <th>성별</th>
                <td>
                    <input type="radio" name="gender" value="male"/> 남자
                    &nbsp;&nbsp;&nbsp;&nbsp;
                    <input type="radio" name="gender" value="female"/> 여자
                </td>
            </tr>
            <tr>
                <th>취미</th>
                <td>
                    <input type="checkbox" name="hobby" value="드라이브"/>드라이브
                    <input type="checkbox" name="hobby" value="스포츠"/>스포츠
                    <input type="checkbox" name="hobby" value="게임"/>게임
                    <input type="checkbox" name="hobby" value="낚시"/>낚시
                </td>
            </tr>
            <tr>
                <th>나이</th>
                <td><input type="number" name="age" min="1" max="200" value="20"/></td>
            </tr>
            <tr>
                <th>보안등급</th>
                <td><input type="range" name="security" min="0" max="100" value="0" step="20"/></td>
            </tr>
        </table>
        </fieldset>
    </body>
</html>

- VSC 에서 Terminal > new Terminal