lyuna's story

자바스크립트 코드를 짜면서 같은 api를 여러 자바스크립트 페이지에서 사용해야 할 때 Export (내보내기) 와 Import(가져오기) 기능을 쓰면 된다. 우리 조 같은 경우에는 같은 api 주소를 각각 다른 페이지에 불러와야 해서 사용해보았다.export const options = { method: "GET", headers: { accept: "application/json", Authorization: "Bearer eyJhbGciOiJIUzI1NiJ9.eyJhdWQiOiI3ZTI2NzY3Mzk4NGFkOThiNjIxM2EwMzY0YjI4MDk4ZCIsInN1YiI6IjY2Mjc5MGQ4MjljNjI2MDE3ZTRhNGY2YSIsInNjb3BlcyI6WyJhcGlfcmVhZCJdLCJ2ZXJza..

튜터님 깃허브 프로필을 구경해보다가 화려하게 꾸미신게 탐나서 찾아보게 되었다.!우선 많은 기능이 있었는데 복잡해서 하나만,, ㅎㅎ 이 친구를 프로필에 넣어보겠다! 1. ID 레파지토리를 생성한다! 레파지토리 이름을 본인 깃허브 아이디로 설정한다add a readme file 체크하고 create repository 클릭  read me 파일에 연필모양 버튼을 클릭하면 편하게 수정이 가능하다. https://80000coding.oopy.io/865f4b2a-5198-49e8-a173-0f893a4fed45 깃허브 프로필 꾸미기!깃허브에 들어갈 때마다 허전한 내 프로필..80000coding.oopy.ioiterm2 연동 후에 테마 적용해주면 끝!!

인기영화 API를 가져와서 검색하는 기능까지 구현을 하였으나필터기능에서 대문자 소문자 구별없이 섞어 검색해 보았을 때도 결과가 나오도록 하고 싶었다.   소문자로만 검색을 해 보았을 때 인식을 하지만, 대문자로만 검색해 보았을 때는 인식을 하지 못하는 상태. WHY? >>'movie' 객체의 'title' 속성 값을 toLowerCase를 주어 소문자로 변환하였으나검색어의 속성값은 변환하지 않았기 때문. 해결방법은 너무 간단했다. 말 그대로 검색어의 속성값에 toLowerCase를 주어 속성값을 소문자로 변환하면 된다.!그러면 검색 할 때 대소문자를 섞어도 소문자로 변환해주고, movie title도 이미 소문자로 변환되어 있기 때문에 검색결과가 깔끔하게 나오게 되는 것.!  대소문자를 섞어보아도 검색결..

우선 누끼를 따줘야 하는데 아래의 사이트에 들어가서 원하는 이미지 파일을 불러온다.https://www.remove.bg/ko 다운로드 버튼을 누르면  이렇게 누끼따진 이미지로 저장이 된다. 그 후에 https://icoconvert.com/ ICO Convert - Create Icons From PNG & JPG Images OnlineStep 3. Apply styles( optional ) Click the style you like to apply it to your icon, click it again to deselect it, you can select multiple styles. In Windows 7, you can press "Win + D" to show the desktop, t..

tmdb 회원가입 후 API 페이지로 들어간다API Reference를 클릭검색창에 원하는 데이터 검색원하는 언어 선택 후에 복사하고 JS폴더에 삽입해주면 끝!!

과제 개요순수 바닐라 자바스크립트만으로 영화 리스트 조회 및 검색 UI 구현필수 요구사항- [1] jQuery 라이브러리 사용없이 순수 바닐라 자바스크립트 사용하기- [2] TMDB 오픈 API를 이용하여 인기영화 데이터 가져오기- [3] 영화정보 카드 리스트 UI 구현    - TMDB에서 받아온 데이터를 브라우저 화면에 카드 형태의 데이터로 보여줍니다.    - 카드에는 title(제목), overview(내용 요약), poster_path(포스터 이미지 경로), vote_average(평점) 이렇게 4가지 정보가 필수로 들어갑니다.- [4] 영화 검색 UI 구현    - API로 받아온 전체 영화들 중 영화 제목에 input 창에 입력한 문자값이 포함되는 영화들만 화면에 보이도록..

팀원끼리 회의해 보았을 때 강의를 먼저 듣는 것이 낫다고 판단하여 5주차까지 배속해서 다 듣기로 하였으나.우리도 하면서 이건 아니라는 것을 깨달았고 튜터님과 매니저님께 상담을 받고 난 후에1,2주차만 우선 듣고 손코딩을 해보라고 하셔서 팀원들과 뒤늦게서야 실습을 해보기로 하였다.이런식으로 실습을 하면서 기본 코드를 익힌 후에 개인과제의 틀을 먼저 잡아보기로 하였다.

벌써 1주차가 끝나고 내배캠 2주차에 돌입했다. 한 주 동안 정들었던 팀원들과도 빠이빠이 하고 새로운 팀원과 새로운 시작을 하게 되어서 아쉬움도 있었지만 한편으로 설레기도 했다. 이번주는 javascript 문법 강의를 들으며 내용을 익히고 개인과제까지 해결해야 한다.우선 강의내용을 한번 쑥 훑으면서 진행해야겠다. JS 언어의 특징, 역사 그리고 문법에 대해 배우고 조건문, switch문, 마지막으로 배열, 객체까지 배웠다.<p data-k..

오늘은 메인 페이지를 각자 만들어보기로 한 날~!개인페이지로 숙련을 좀 해둔 탓에 머릿속으로 어떻게 해야할지 대충 그려졌다.각자 메인페이지 틀을 잡아보자 해서 만들고 다른 팀원분 것이 채택돼서 그 코드로 진행하기로 했다.팀원 한 분이 맡아서 메인페이지를 완료 해주셨댜! 이렇게 완성된 우리 팀 메인페이지  각자 zep 캐릭터를 넣어서 게임느낌이 나게 메인을 설계했다! 마우스를 올리면 밝기를 낮춰주는 hover기능도 사용하였다.

어제 수업이 끝나기 전에 튜터님께 숙제를 하나 받았다. flex를 사용하여 본문 박스와 해시태그 박스를 일정하게 배치 하는? 숙제.어제 받았던 flex 관련 포스트를 읽어보고 사실 이것 저것 다 넣어보니 되더라,, 해보는게 답이다.프로필과 해시태그 박스를 묶은 main div에 dislpay: flex; 을 선언해주고 세로로 정렬 후에  아이템 사이에 균일한 간격을 만들어주는 space-between을 선언했다. 그러니 오른쪽처럼 쨔잔 하고 떨어지더라. margin-top을 주어도 모양은 같았음 하지만 여러 아이템이 있다면 이 방법이 훨씬 간단할 것 같다. 하나 끝내고 나니 또 과제를 내주셨다. h2태그로 작성한 해시태그에 마진을 없애고 div안에서 가운데 정렬하기이건 생각보다 쉬웠다 무족건 flex관련..