728x90
728x90
SMALL

html 5

미니 프로젝트

위 제목은 말 그대로 13일 화요일부터 16일 금요일까지 미니 프로젝트 기간이었습니다. 프로젝트는 HTML, CSS, JS를 사용하여 진행되었고 목표는 ChatGPT API를 활용하는 것이 기본 프로젝트의 목표였습니다. 저는 개인비서 서비스를 구현하는 것으로 진행하였고 앞으로 발전 가능성이 크다고 생각하고 있습니다. 서비스 명은 지니스트(Genist)로 Genius와 Assist의 합성어로써 뛰어난 개인비서의 의미를 담고 있어 매력적인 이름입니다. 사용자에게 스케줄 관리와 도움을 제공하는 목표는 효과적인 개발을 통해 실현될 것으로 기대됩니다. 개발 환경으로 Visual Studio Code를 선택한 것은 가벼운 환경에서도 효과적인 작업이 가능하다는 판단과 HTML, CSS, JavaScript로 파일을 ..

24.01.31

Position HTML 태그의 위치를 지정해 주는 속성 (페이지의 레이아웃을 결정할 수 있음) 1. static = 따로 position 속성값을 주지 않았다면 static 값을 가짐, html에 쓴 태그 순으로 정상적인 흐름(normal flow)에 따라 위치가 지정되게 됨 2. relative = 원래 자신이 있어야 하는 위치에 상대적, 자신이 원래 있던 자리를 기억함 원래의 자리를 인식하지만 left, right, top, bottom 속성을 이용해서 움직일 때는 다른 콘텐츠들의 레이아웃에 영향을 미치지 않음 3. absolute = 부모 요소 내부에 속박되지 않고 독립된 배치 문맥 (my way), absolute는 static을 제외한 position 속성값을 가진 가장 가까운 부모의 박스 내..

24.01.29

벌써 1월 마지막 주 월요일이네요. 어느덧 오름캠프를 시작한 지 두 달째 되었어요, 항상 느끼지만 시간은 정말 느린 것 같다가도 빠른 것 같아요. 오늘은 저번 HTML에 이어 기본 양식들에 대해 알아보며 VSCode에 직접 코드를 입력해 보며 배워보았어요. 까먹은 것들이 많지만 직접 쳐보니 또 새록새록 기억이 나네요. Form 사용자에게 입력받은 정보를 제출하기 위한 대화형 컨트롤을 포함하는 문서 구획 Q. 꼭 form 태그로 묶어줘야 할까? A. form 태그는 입력한 데이터를 제출 or 전송하기 위해 사용하는 태그, 별도 제출 필요가 없다면 사용하지 않아도 됨 = 단순히 입력받는 값을 화면에 나타내는 용도 1. Method 속성 양식을 제출할 때 사용할 HTTP 메서드 + GET https://exa..

24.01.26

이제 Python은 마무리 나고 다음 HTML 수업을 시작하였습니다. 지금은 Back-End에 관심 있었지만, 원래는 Front-End 쪽을 고민했었습니다. Back-End는 약간 아직 만들어지지 않은 것들을 구성하고 계획하여 만드는 것이 있는데, Front-End는 Back-End가 구성해 놓은 것들을 꾸미는 듯한 느낌이랄까? 요소들을 적용시킬 때마다 그때그때 즉각 나타나는 것이 굉장히 흥미로웠고 매력적이었어요. 하지만 제가 느낀 Front-End는 시대적인 트렌드에 민감하다고 해야 할까요. 그런 디자인 감각들을 표현하기엔 너무 어렵고 힘들더라고요, 그리고 디자인 경험은 한 번이면 족하는 이유도 있었어요. 그렇지만 오랜만에 진행하는 HTML은 언제 봐도 재밌고 그 처음 배웠던 설렘이 느껴져요 :) HT..

BEAR-U : Django (7)

오늘은 Front-end의 영역에 대해 공부하는 시간입니다. html과 css는 간단하면서도 실습 과정 중 결과가 바로 눈에 보이기 때문에 즐겁게 공부하였던 적이 있습니다. java script 역시 마찬가진데, 그 기억을 되살려 이번 강의도 복습차원에서 열심히 듣겠습니다 :) ​ 7강. HTML+CSS+JS 찍어 먹어보기 '웹프론트의 근간 HTML+CSS+JS의 기초지식을 배운다.' HTML html파일에 style 코드들이 많아져 관리 수정에 어려움을 겪지 않도록, 따로 .css 파일을 생성하여 관리한다. 그리고 html 파일에서 link를 이용하여 .css 파일과 연결시켜주어 작동할 수 있도록 한다. CSS .content{ white-space: pre-wrap; background-color: ..

728x90
728x90
LIST