깃허브에 코드를 올릴 때 API 키 값과 같은 올라가면 안되는 일부 내용을 여러가지 방법으로 숨길 수 있다. 리액트에서는 .env라는 것을 사용하고, 깃허브 자체 내에서는 Action을 사용해 코드를 노출하지 않을 수도 있다. 여러 가지 방법들이 존재하기 때문에 상황에 맞는 방법을 찾아 적용하는 것이 좋아보인다.
백틱(` `)을 사용하면 변수에 저장된 값을 아주 쉽게 문자열에 넣을 수 있다. 이 형식은 C언어의 printf문이나 C#의 format형식과 상당히 유사한데, 자바스크립트의 백틱은 html도 넣을 수 있기 때문에 아주 유용하다.
키보드의 엔터 키의 키 코드는 13으로, event의 keyCode를 (e.keyCode === 13)와 같이 사용했을 때 엔터 키를 눌렀다면 true로 결과가 나온다.
오늘 한 일
알고리즘 4문제를 풀었다.
영화 카드를 만들었다. 카드 속 내용은 TMDB API를 통해 불러온 객체를 이용해 채워넣었다.
영화 검색 기능을 추가하였다. 각 영화 카드에 있는 영화 제목과 검색한 텍스트를 toLowerCase() 함수를 이용해 대문자를 소문자로 변경하고 search() 함수로 비교해 display속성을 조건에 따라 변경하였다.
// 전부 소문자로 변경.
let movie_name_lower = movie_name.toLowerCase();
let search_text_lower = search_text.toLowerCase();
// 검색한 문자열이 영화 제목에 존재하면 해당 카드를 제외하고 display 전부 끈다.
if(movie_name_lower.search(search_text_lower) !== -1){
console.log(`I found this movie: ${movie_name}`);
movie_card.style.display = 'block';
}
else{
movie_card.style.display = 'none';
}
오늘 하루는?
알고리즘 문제에 더이상 빈 칸은 없다. 처음 문제를 푼 사람이라는 칸에 새로 비집고 들어올 이름 따윈 더이상 없다는 것이다. 코드카타라는 이름으로 묶인 알고리즘 문제들은 더이상 나에게 흥미로운 대상이 아니게 되었다.
최종 결과: 가장 빠르게 제출한 사람: 윤형석 100 / 122
주말동안 시간들여 만들려고 했던 개인 과제가 너무 싱겁게 하루만에 하나를 제외한 모든 요구한 기능들을 구현했다. 이틀동안 시간쓰려 했는데.... 열심히 꾸미기나 해야겠다.
