fpzmfks 님의 블로그

오늘은 마지막 날로, 거의 마무리된 결과물을 전체적으로, 그리고 세세하게 살피면서 css에 미흡한 점이나 페이지 이용에 불편한 점 같은 것들을 찾아서 수정했다.  그리고 먼저 언급할 것은, 어제 작업한 링크 등의 동적 css들을 내 마음대로 반영했다가 일부 삭제 피드백을 받았다는 것이다. 대강 구현한 게 거의 밤 9시이니만큼 다른 분들도 피곤할테니 일단 반영부터 하고 본 것인데, 사실 add commit만 해두고 오늘 아침에 피드백을 거친 후 merge하면 되는 일이기는 하니 내 잘못이 맞았다. 앞으로는 git pull 다음 git push뿐만이 아니라 git 피드백도 명심해 두어야겠다.  다음으로 오늘 한 것 중에서 가장 인상적이었던 것은 id값을 css에서 사용한 것이다. 사실 학습하는 입장이라 하루..

오늘은 다른 팀원들을 돕고, git을 열심히 자습하고, 메인프레임도 조금 건드리다가 '일거리는 스스로 찾아내는 것이다'라는 조언을 듣고 css에 자주적으로 손을 대어보았다. 태그를 이용해서 유튜브 링크를 숨겨넣는 등으로 페이지가 좀 더 동적으로 움직이도록 한 것이다.   태그는 지난 번에 이미 사용해보았으니 더 말할 것은 없고, 이번에는 hover와 cursor로 페이지를 꾸며 보았다.  먼저 hover는 css파일에서 .(클래스명):hover {    background-color: black;} 과 같은 형태로 사용되는 기능으로, 이 기능을 사용한 html 요소에 커서를 옮기면 대상의 색이 변하는 등의 변화가 나타나서 웹페이지에 생동감을 더할 수 있다. 나는 이 기능을 유튜브 링크를 숨겨넣은 글자,..

오늘은 다른 팀원 분이 디자인한 대로 메인 프레임을 구성하는 것을 좀 더 다듬었다. 그 과정에서 코드를 좀 건들기는 했는데, 내 파트는 이제 마무리가 되어서 이후로 git에 대해 찾아보았다.  먼저 git을 사용하여 프로젝트를 시작할 때의 명령어를 정리하겠다.  내가 팀장으로써 프로젝트를 시작할 때파일을 생성한다. ex) 직접 생성, mkdir 이용윈도우의 경우 git bash로 terminal 열기cd git init으로 .git 파일 생성ls -a로 .git 파일 확인메인 화면 등의 기본 틀 잡기저장git add .'.' 위치 주의! cd로 지정한 경로 내의 모든 파일을 지정한다는 의미이다.git commit -m "프로젝트 시작"으로 파일 저장git status, git log 등으로 commit ..

DOCTYPE html>html lang="ko">head>  meta charset="UTF-8">  meta name="viewport" content="width=device-width, initial-scale=1.0">  title>여기서부터는 P4J1팀의 페이지입니다title>  link rel="stylesheet" href="./css/common.css">head>body>  div class="page">    div class="head">      span style="color: white; font-size: 30px; position: relative; right: 47%; top: 2%;">P4J1span>      div class="mBox">        div clas..

오늘은 메인 프레임 틀을 짜고 git을 이용해서 git push, git pull을 여러 번 한 뒤 추후에 구현해야 하는 다른 html 파일과 연결하기 기능에 대해 검색하고 학습해 보았다. 아래는 메인 프레임의 대략적인 틀이고, 이 중에서 슬라이드 카드와 팀원 캐릭터는 다른 팀원이 맡았으며, 나의 남은 과제는 링크 기능을 구현하는 것이다.   => 지금까지 짠 메인프레임 코드 링크(다른 팀원의 디자인대로 구현한 것) 이 코드를 구현하는 데에 약간의 문제가 있었다면, 처음엔 position:relative와 position:absolute로 구현했다가 같은 페이지 구현에 힘쓰는 다른 팀원의 의견으로 display:flex로 정렬하여 구현했던 것이다. flex를 요즘 많이 쓴다고 들었는데, 과연 positi..

오늘은 드디어 본캠프가 시작된 날이다. 여태까지는 모든 프로젝트를 개인으로 끝냈었는데, 이제부터는 팀 단위로 프로젝트를 진행하며 역할 분담을 하고, 또 인력이 더 있으니 더 많은 기능을 구현한 페이지를 작성할 수 있게 되었다.  오늘 대부분의 시간을 자기소개 페이지를 구체적으로 어떻게 만들 것인지에 대해 회의하며 보냈다. ui, 페이지 구성, 구현 기능, 디자인, 삽입할 내용 등등에 대한 이야기를 하였는데, 팀원들과의 첫 만남이니만큼 신변잡기에 대한 이야기도 많이 했다. 그리고 오후 6시에 회의를 마무리하며 나는 팀원 중 한 분이 디자인하신 메인 페이지의 구성과 서브 페이지와의 연결을 담당하게 되었다.  여태껏 html과 css는 적당히 가능한 만큼만 해왔는데, 이번 기회에 html을 더욱 파고들게 될 ..

본페이지htmlDOCTYPE html>html lang="en">head>    meta charset="UTF-8">    meta name="viewport" content="width=device-width, initial-scale=1.0">    title>일정표title>head>link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet"    integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">style>    .header {    ..

나도 내가 이걸 해낼 줄은 몰랐는데, 어찌됐든 To Do List 페이지 작성을 완료했다! 사실 처음 내가 구성했던 것과는 좀 다른 모습인지라 썩 만족스럽지는 않지만, 지금 내가 해낼 수 있는 범위에서 최선을 다했다고 말할 수 있다.  먼저 본 페이지를 작성함에 앞서서 간단하게 구성한 코드와 페이지에서 버튼으로 함수가 실행되는 구조를 한 번 완성시켰다. 수정-완료-삭제의 3가지 구성으로 만들었는데, 수정 기능이 많이 어설프지만 일단 같은 기능을 본 페이지에도 구성했다.  간단한 구성의 to do list 페이지풀어서 설명하자면각 인풋 박스에 내용을 입력=>등록 버튼으로 등록하고 인풋 박스 내용은 초기화=>카드 생성 완료 기능녹색 '완료!' 버튼을 누르면 내용에 줄이 그어짐 삭제 기능'x' 버튼을 누르면 ..

오늘은 완전히 죽 쒔다. 내가 어제 to do list 삭제 기능을 만드는 데에 참고 했던 자료들은 각각 jquery를 사용하지 않는 바닐라 자바스크립트와 react를 사용하여 페이지를 구성하는 코드들이었다. react는 현재로써는 미지의 영역이니 제쳐 놓고, jquery를 사용하지 않는 코드는 작성할 수 있을 것 같다. 다만 해당 글의 코드 구현 방식은 foreach를 통해 '리스트 배열'을 만드는 것이었고, 내가 사용한 것은 `` 내의 일련의 바디 코드를 선언한 변수를 append로 붙이는 방식이었으니 이러한 차이에서 어떻게 해당 글의 삭제 기능 구현 방식을 참고할 수 있을지 미지수이다.  그저 어림짐작하기를, 내가 이전에 간단하게 리스트를 만든 것처럼 ``을 사용하지 않고 하나하나 변수 선언하고, ..

오늘은 2개의 코드카타를 했는데, 2번째 문제에서 막혔다. splice로 배열의 최소값을 제거하려고 하니까 자꾸만 이상한 결과값이 나오는 것이다. 여러가지를 검색해보았고, 먼저 filter를 사용하였지만 다른 방법으로도 다시 문제를 풀어보았다.  최초로 내가 성공한 해답은 이것이다.  function solution(arr) {     var answer = [];     let minval = Math.min.apply(null, arr);          arr = arr.filter((e) => e !== minval);          answer = arr;     if(answer==0) {         return [-1];     }     return answer; } math.min...