메모장

*{  margin: 0;  padding: 0;  box-sizing: border-box;}ul, li{  list-style: none;}/* 스타일 추가: 네비게이션 메뉴 항목을 버튼처럼 스타일링 */.header-nav{  font-weight: bold;  display: flex;  justify-content: space-around;  align-items: center;  background-color: #f0f0f0;  padding: 10px 20px;  ul{    display: flex;    gap: 20px;    li{      padding: 20px;    }  }  b{    color: blue;  }  ul> li:hover{    cursor: pointer; ..

DOCTYPE html>html lang="en">head>  meta charset="UTF-8">  meta name="viewport" content="width=device-width, initial-scale=1.0">  title>Documenttitle>  link rel="stylesheet" href="./css/style.css">  script src="./js/script.js">script>head>body>  div>    div class="title">      img src="./image/llogo.jpg" alt="image">    div>    div class="menu">      ul class="menu_top">        li>회사소개li>        ..

* {  margin: 0;  padding: 0;}ul,li {  list-style: none;}a {  color: inherit;  text-decoration: none;}.start {  height:903px;}.re {  width: 100%;  height: 100%;  }body {  background-color: #000;  width: 1920px;}.menu {  position: fixed;  top: 0;  left: 0;  width: 100%;  height: 150px;  background-color: black;  display: flex;  color: white;  justify-content: space-between;  font-size: 30px;  z-in..

처음에 피그마 라고 하는 말을 듣고 강사가 욕하는 줄알았다. 이게 서든어택을 하다보니 계속 비슷한 욕을 우리 잼민이 분들이 너무 많이 해서 그런 듯..  피그마라는 건데 이렇게 사이트를 임의로 디자인해서 일단 만들고나서 이것에 따라서 사이트를 구성해보는거다. HTML로 구성 -> CSS로 꾸미는 것. 하여튼 이런 구성인 만큼 디자인도 어느정도 필요하다고 한다. 위 그림은 내가 사이트를 만드는 것을 그려서 대략 이렇게 완성할 것을 그림으로 나타낸 것이다. 파워포인트로 발표할 준비를 할때 그림으로 디자인 꾸미는 것과 동일하게 생각하면 편함! 이건 여러사람들이 실시간으로 참여해 같이 그릴 수 있어서 작업하고 의견나누기에 적합하다고 보면 된다.

나는 비정공자로서 1달 느낀점을 말해보려고 한다.  1. 비전공자들은 왠만하면 비전공자들 끼리 수업 받는게 좋다.- 전공자들은 진도 안 나가서 답답해하는게 보임 뭔가 죄 짓는 기분.   - 전공자 및 현역 종사자가 수업을 들음, 포트폴리오를 만들기 위해 수업을 듣더라..    보면 자는 사람도 있어서 비전공자들은 공부하는데 있어서 뭔가 분위기 별로 임.. 2. 왜 어려운 가?  - 어려운 이유는 일단 우리가 비 전공자인 컴공에서 말하는 여러가지 상식 같은    지식이 없기에 많이 어려운 게 사실이라 의욕과 끈기로 버텨야 함.  - 다른 언어중에 그나마 HTML과 CSS 자바스크립트가 쉽다고 하는 데비전공자가 보기에는 그냥 외계어 임.    3. 어떻게 해야 하냐?    - 비전공자인 경우 그냥 멘땅에 헤..

DOCTYPE html>html lang="en">  head>    meta charset="UTF-8" />    meta name="viewport" content="width=device-width, initial-scale=1.0" />    title>freight1title>    script      src="https://kit.fontawesome.com/103d787f99.js"      crossorigin="anonymous"    >script>    link rel="stylesheet" href="css/homepage.css" />  head>  body>    header>      div class="container">        div class="logo">   ..

DOCTYPE html>html lang="en">  head>    meta charset="UTF-8" />    meta name="viewport" content="width=device-width, initial-scale=1.0" />    title>Documenttitle>    style> * {            margin: 0;            padding: 0;            box-sizing: border-box;        }        .container {            display: flex;            width: 1200px;            height: 100%;        }li        .second {         ..

일단 비정공자라면 당신도 공감하겠지만 프론트앤드니 코딩이니 xx 모른다. 알수있을리가 없지. 일단 내가 이해한것 부터 한번 적어보겠습니다. 우리가 인터넷 화면에 보는 것을 띄우려면 블로그 꾸미는 것 마냥 스타일도 바꿔주고 뭐 누르면 뭐가 뜨게 끔 해주는 이런 화면들을 구성해서 작동시키는 걸 프론트앤드라고 하는 것 같고 백앤드는 그것을 뒤 받침해줄 서버와 정보작업들을 해주는 거라고 이해함. 그리고 프로그래머는 옛날 가전 기기마져 돌아가게끔 무슨 기계언어 를 배워야 하는 직업인듯. 일단 이 3가지 다 할 줄안다? 이걸 풀 스택 개발자 라고 함. 나는 그중에서 그나마 난이도? 낮은 프론트앤드 개발에 한번 뛰어들어 보았습니다. 앞에서 말한 것 처럼 화면 구성이며 이것 저것 해야 하는 직업인데이걸 어디다 하느냐?..

1일차 진행과정 설명 - 대충 취업 설명2일차 간단한 GIT허브의 등록과 거기다 수업을 저장해두는 절차를 좀 배움3일차 HTML 구조에대한 공부와 이것저것 시스템 만져봄 일단 "이해" 라는 명목 하에는 잘 되는 듯 합니다. 오늘은 일단 각종 이미지와 링크를 연결 하는등을 집중적으로 배운 듯 함.    (이것은 CSS를 연결할때 사용) 쳇 GPT를 사용했을때는 뭔가 REL부분이 빠져있었던것 같은데 어쨋든 이게 정석이니 정석을 따르자. (이것은 자바스크립트 연결을 위해) *-------------------- 윗 부분들은 헤드 안에 들어가야 하더라, 뭐 바디안에 들어가도 작동은 하는데, 그래도 헤드안에 넣자나도 잘모름 그게 맞데.. 몰라 XX.. 다음은 사이트 주소나 페이지, 사진 연결인데 이건 주가 되는 ..

티스토리에는 html을 사용해서 글을 쓰는 모드가 있다. 지금 사용할 코드는 이것이다.     네이버       여기서 이부분 스타일부분인데,     .first {    display: inline-block;    background: #333;    color: #fff;    border: solid;    border-color: red;     padding: 10px 20px;    cursor: pointer;} 이부분은 css에 해당하는 부분이다. 나도 처음 공부하는 입장에서 많이 헷갈린게. html과css와 자바스크립트 부분이 각각 나뉘어서 보통 코드를 작성하는데.이런 티스토리 같은 경우 html만 있고 css가 없던데 어떻게 하는 건가? 싶었다. 그런데 이렇게 html상에 넣으..