1 분 소요

1. 서론

    오늘은 HTML과 CSS, 그리고 Samba 서버를 다루는 법에 대하여 배워보았다.

2. 본론

1. Front-End

image

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <form>
      <fieldset>
        <legend>신상정보</legend>
        <tr>
          <td>
            <table for="username">
              아이디
              <td>
                <input id="username" type="text" name="user" />
              </td>
            </table>
          </td>
        </tr>
        <tr>
          <td>
            <table for="password">
              비밀번호
            </table>
          </td>
          <td>
            <input id="password" type="password" name="pwr" />
          </td>
        </tr>
        <table>
          <tr>
            <td>성별</td>
            <td>
              <input id="man" type="radio" name="gender" value="m" />
              <label for="man">남자</label>
              <input id="woman" type="radio" name="gender" value="w" />
              <label for="woman">여자</label>
            </td>
          </tr>
        </table>
      </fieldset>
    </form>

    <fieldset>
      <legend>선택사항</legend>
      <table>
        <tr>
          <td>선택</td>
          <td>
            <select>
              <option>김밥</option>
              <option>제육</option>
              <option>불고기</option>
            </select>
          </td>
        </tr>
      </table>
      <table>
        <tr>
          <td>다중</td>
          <td>
            <select multiple>
              <option>김밥</option>
              <option>제육</option>
              <option>불고기</option>
            </select>
          </td>
        </tr>
      </table>
      <!--tr>td*2-->
      <table>
        <tr>
          <td>그룹</td>
          <td>
            <select>
              <optgroup label="수업">
                <option>1교시</option>
                <option>2교시</option>
                <option>3교시</option>
              </optgroup>
              <optgroup label="요일">
                <option>월</option>
                <option>화</option>
                <option>수</option>
              </optgroup>
            </select>
          </td>
        </tr>
      </table>
      <input type="submit" value="가입" />
    </fieldset>

    <fieldset>
      <legend>입력 양식</legend>
      <table>
        <tr>
          <td><label for="name">이름</label></td>
          <td><input id="name" type="text" /></td>
        </tr>
        <tr>
          <td><label for="mail">이메일</label></td>
          <td><input id="mail" type="email" /></td>
        </tr>
      </table>
      <input type="submit" />
    </fieldset>
  </body>
</html>

image

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>HTML5 기본 프로젝트</title>
  </head>
  <body>
    <header>
      <h1>HTML5 Example Preview</h1>
      <h2>한국정보교육원</h2>
    </header>
    <nav>
      <div>
        <ul>
          <li>HTML5</li>
          <ul>
            <li><a href="#">데이터</a></li>
            <li><a href="#">데이터</a></li>
            <li><a href="#">데이터</a></li>
          </ul>
          <li>CSS3</li>
          <ul>
            <li><a href="#">데이터</a></li>
            <li><a href="#">데이터</a></li>
            <li><a href="#">데이터</a></li>
          </ul>
          <li>JavaScript</li>
          <ul>
            <li><a href="#">데이터</a></li>
            <li><a href="#">데이터</a></li>
            <li><a href="#">데이터</a></li>
          </ul>
        </ul>
      </div>
      <div>
        <div>
          <form>
            <input type="text" />
            <input type="submit" value="가입" />
          </form>
        </div>
      </div>
    </nav>
    <div>
      <section>
        <article>
          <h1>HTML5 개요와 활용</h1>
          <h3>2023년 4월 5일</h3>
          <img src="http://placehold.it/430x280" alt="no_image" width="430" />
          <p>
            Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga
            deserunt cupiditate aperiam quasi incidunt, ab sit aut commodi
            consequuntur possimus illo facere deleniti nobis, ipsam modi!
            Necessitatibus, non. Et, corrupti! Aut delectus harum doloribus ab
            laboriosam incidunt unde, nulla suscipit sapiente repellat
            doloremque pariatur et quisquam qui quia!
          </p>
          <p>
            Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga
            deserunt cupiditate aperiam quasi incidunt, ab sit aut commodi
            consequuntur possimus illo facere deleniti nobis, ipsam modi!
            Necessitatibus, non. Et, corrupti! Aut delectus harum doloribus ab
            laboriosam incidunt unde, nulla suscipit sapiente repellat
            doloremque pariatur et quisquam qui quia!
          </p>
        </article>
        <hr />
        <article>
          <h1>HTML5 개요와 활용</h1>
          <h3>2023년 4월 5일</h3>
          <img src="http://placehold.it/430x280" alt="no_image" width="430" />
          <p>
            Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga
            deserunt cupiditate aperiam quasi incidunt, ab sit aut commodi
            consequuntur possimus illo facere deleniti nobis, ipsam modi!
            Necessitatibus, non. Et, corrupti! Aut delectus harum doloribus ab
            laboriosam incidunt unde, nulla suscipit sapiente repellat
            doloremque pariatur et quisquam qui quia!
          </p>
          <p>
            Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga
            deserunt cupiditate aperiam quasi incidunt, ab sit aut commodi
            consequuntur possimus illo facere deleniti nobis, ipsam modi!
            Necessitatibus, non. Et, corrupti! Aut delectus harum doloribus ab
            laboriosam incidunt unde, nulla suscipit sapiente repellat
            doloremque pariatur et quisquam qui quia!
          </p>
        </article>
      </section>

      <aside>
        <div>
          <ul>
            <li>
              <h3>카테고리</h3>
              <ul>
                <li><a href="#">데이터</a></li>
                <li><a href="#">데이터</a></li>
                <li><a href="#">데이터</a></li>
              </ul>
            </li>
          </ul>
        </div>

        <div>
          <ul>
            <li>
              <h3>최근글</h3>
              <ul>
                <li><a href="#">데이터</a></li>
                <li><a href="#">데이터</a></li>
                <li><a href="#">데이터</a></li>
              </ul>
            </li>
          </ul>
        </div>
      </aside>
    </div>
    <hr />
    <footer>
      <span><a href="#">Created By Team-keduit</a></span>
    </footer>
  </body>
</html>

2. Linux

2-1. Telnet

# dnf install -y telnet*.*
# dnf list installed | grep telnet*.*
# systemctl enable --now telnet.socket
# firewall-cmd --add-service=telnet --permanent
# firewall-cmd --reload
# firewall-cmd --list-all | grep telnet
# systemctl restart telnet.socket

2-2. Samba

//Win as a Samba Server, Linux as a Samba Client

//Win
1. Windows 기능 켜기/끄기 -> SMB 모두 설치
2. win + r
-> compmgmt.msc
-> 로컬 사용자 및 그룹
-> 새사용자 (다음 로그온시~, 계정 잠겨 있음~ 둘다 체크 해제)
3. C:\share 생성 후 공유 -> root(읽기/쓰기)

//Centos
# dnf install -y samba-client
# smbclient -U root -L 10.5.1.24 //Samba 서버의 공유폴더 확인
# mount -t cifs //10.5.1.24/myshare /temp -o username=root -o password=1234
# ls -ltr /temp //공유된 파일 확인

3. 결론

    시간이 너무 빠르다.

4. 참고자료

1. 자료

  1. 문웅호, 정보통신망

2. Cisco Docs

  1. ARP
  2. CDP / VLAN
  3. Frame Relay
  4. Static Routing
  5. VLAN
  6. VTP
  7. Routed Port
  8. AD
  9. Route Selection
  10. FHRP
  11. HSRP
  12. DHCP
  13. DNS
  14. STP
  15. NAT
  16. EtherChannel
  17. DTP
  18. RIP
  19. NTP
  20. Offset List
  21. Password Encryption
  22. ACL
  23. CAR Attack
  24. Broadcast
  25. Port Assignments
  26. IPv6 Static Routing
  27. HSRP for IPv6
  28. Clock Rate
  29. DHCPv6 Guard
  30. EIGRP
  31. Express Forwarding
  32. Routing and Switching
  33. Load Balancing
  34. Ping, Traceroute
  35. Load Balancing
  36. Fast Switching
  37. CEF
  38. DNS
  39. SSH
  40. Regular Expression
  41. OSPF
  42. EIGRP’s SIA

3. Linux

  1. rhel9’s docs
  2. Linux Directory Structure
  3. File Types in Linux
  4. fstab
  5. Vim Cheat Sheet
  6. Protecting GRUB with a password
  7. SELinux
  8. DNS
  9. Samba as a server

4. Web

  1. HTML’s Elements
  2. Emmet
  3. JavaScript
  4. Anchor Tag
  5. Post, Get
  6. Block, Inline Elements
  7. Semantic Web
  8. Semantic Elements
  9. CSS

클라우드 엔지니어를 꿈꾸며 공부를 시작한 초보 엔지니어입니다. 틀린점 또는 조언해주실 부분이 있으시면 친절하게 댓글 부탁드립니다. 방문해 주셔서 감사합니다 :)

댓글남기기