본문 바로가기

분류 전체보기139

자바스크립트 랜덤숫자 뽑기(중복 제거) 1. 배열에 중복여부를 확인한 후, 원하는 갯수만큼 랜덤숫자 삽입 function randomArray() { const array = []; while (array.length < 3) { const random = Math.trunc(Math.random() * 10); if (!array.includes(random)) { //중복이 없을경우 array.push(random); } } return array.join("") } 2. Set객체를 이용해(중복 제거) 랜덤숫자 삽입 후, 스프레드 연산자로 배열로 변경 function randomArray() { let array = new Set(); while (array.size < 3) { array.add(Math.trunc(Math.random.. 2023. 4. 4.
[Git & GitHub] 깃허브로 협업하기 - fork / pull requests 깃헙으로 협업하기 위한 전체적인 과정들을 간략하게 정리해 보려고 한다. 다음 과정은 외부 원격 저장소에서 for하여 내 원격저장소로 가져와서 pull requests를 요청하는 방식으로 진행된다. 현업에서 가장 많이 사용하는 방법이라고 한다. 깃헙 기본 개념 - remote : 원격 저장소 - local : 로컬 저장소 - push : 파일을 업로드 하는 것이 아니라 버전을 업로드 하는 것이 push다. 소유하지 않은 원격저장소는 기본적으로 push가 불가능하다. => 콜라보레이터에서 add people하면 가능은 하지만, 이렇게 되면 무분별한 push로 저장소가 어지럽혀지기 때문에 권장하지 않는다. *푸쉬권한 최소화 => 푸시 권한은 팀장 등 책임자만 부여 하는 것이 좋다. *push권한을 아무한테나 .. 2023. 4. 3.
[WIL-001] 토이 프로젝트 - 펫스타그램(Petstagram) 🦄 토이 프로젝트 19조 - 펫스타그램(Petstagram) ✨진행 날짜 : 3/28 ~ 3/31일(3~4일) 토이프로젝트 주간동안 3명의 팀원과 함께 펫스타그램(Petstagram)이라는 웹 사이트를 개발했다. 팀원들과 함께 3일동안 프로젝트를 진행하면서 느낀 부분들을 작성해 보려고 한다. 무엇을 고민했나? 일단 프로젝트 기간이 매우 짧았다. 원래 월~목요일까지 였으나, 우리는 첫 프로젝트 주제를 한 번 뒤엎고 새 주제로 변경하여 하루 ~ 이틀정도의 시간을 버렸기 때문에 시간이 많이 부족했다.. 처음 구상한 프로젝트 주제는 한강 정보 웹사이트 만들기였다. 한강의 여러 공원들(망원, 여의나루 등등...)의 지역들로 나누어 그 지역들의 명소에 대한 순위를 제공하고, 해당 장소에 대한 정보, 리뷰, 댓글 등.. 2023. 4. 1.
[JS] 온보딩 3주 4일차 - 동기와 비동기, 콜백지옥과 Promise 🦄 온보딩 3주 4일차 - JS동기와 비동기, 콜백지옥과 Promise ✨03/23 : 목표 : 비동기 개념에 대한 이해 오늘은 부족했던 자바스크립트 개념에 대해 이해하는 시간을 가지기로 했다. 그 동안 항상 어려워했던 동기와 비동기에 대한 개념, 콜백지옥과 Promise를 사용하는 이유와 방법에 대해 공부해 보았다. 01 동기와 비동기 1. 동기와 비동기 1) 동기(scynchrounous) : JS는 동기적이다 => hoisting이 된 이후부터, 코드가 우리가 작성한 순서에 맞춰서 하나하나씩 자동적으로 실행된다. 2) 비동기(asynchronous) : 언제 코드가 실행될지 예측할 수 없는 것을 말한다. setTimeout(() => console.log("2"), 1000); //콜백을 이용한, .. 2023. 3. 23.
[SCSS] 온보딩 3주 3일차 - Swiper와 SCSS 사용해 보기 🦄 온보딩 3주 2일차 - SCSS 설치 및 사용해 보기 ✨03/22 : 목표 : SCSS 설치 및 기본 문법 익히기 Swiper를 이용해 슬라이드를 가져오고, SCSS로 커스터마이징 해보자. 01 Swiper 슬라이드 사용해 보기 1. Swiper홈페이지 => Demos => 목록 중에서 원하는 슬라이드 가져오기 2. Core(html,css,js), React, Vue 등 여러 종류로 코드를 볼 수 있다. 클릭하면 코드가 쭉 나오는데 이 코드를 개인 플젝에 첨부하면 된다. 주의할점은1. script를 올바르게 가져왔는지, 2.슬라이드는 position 설정이 중요한데, 코드에서는 보통 html이나 body에 relative가 걸려있기 때문에 원하는 요소에 옮겨서 잘 조정해 주어야 한다. HTML 이 .. 2023. 3. 23.
[SCSS] 온보딩 3주 2일차 - SCSS 설치 및 사용해 보기 🦄 온보딩 3주 2일차 - SCSS 설치 및 사용해 보기 ✨03/21 : 목표 : SCSS 설치 및 기본 문법 익히기 온보딩 스터디 2일차, 제공된 CSS 강의가 아무런 의미가 없는 강의인 것 같아 원래 이번 주 목표였던 SCSS에 대해 공부하기로 했다. 오늘은 공식문서를 참고하여 설치 및 기본 문법을 좀 익혀보고 연습도 할겸 앞으로는 항상 SCSS를 사용해 프로젝트를 진행해 보려고 한다. 📒SCSS 설치 및 경험해 보기 00 SCSS란 무엇인가? 1. SASS : Syntactically Awesome Style Sheets - 문법적으로 어썸한 스타일시트 2. SCSS : Sassy CSS - 문법적으로 Sassy한 멋진(Sassy) CSS Sass는 CSS의 단점을 보정하기 위한 CSS의 확장으로 .. 2023. 3. 21.