miniProject 썸네일형 리스트형 [Team Project] 2차 팀 프로젝트 스카이스캐너 마무리(회고) 2차 프로젝트 기간이 끝이 났습니다 결론부터 말씀드리자면 개인적으로 코로나의 자가격리 기간이 겹쳐 굉장히 아쉬운 프로젝트가 되었습니다 팀원분들에게 마음 한 구석 미안한 마음과 격리 중이라 이러지도 저러지도 못하는 상황이 답답할 때도 있었습니다 먼저 그런 와중에 멘탈 잘 붙잡고 저의 빈자리를 꽉 채워준 팀원 분들 너무너무 감사합니다! 후일 기회가 온다면 꼭 사이드 프로젝트를 진행하여 불코딩 해보겠습니다 프로젝트 마무리 시작하겠습니다 프로젝트 명 : WESCANNER 개요 : 항공권, 호텔, 렌터카를 한 번에 비교하고 예약할 수 있는 중개사이트인 Skyscanner를 모티브로 한 호텔 중개사이트 리제작 Github GitHub - jihoon8730/2nd_project: 프론트_프로젝트 프론트_프로젝트. .. 더보기 [Team Project] 2차 팀 프로젝트 스카이스캐너 중간 점검 드디어 코로나에 걸려버렸다... 이틀 차까지는 몸살감기처럼 많이 아팠는데 약 먹고 잠을 엄청나게 자고 나니 목감기 수준으로 내려와 블로그 쓸 힘도 생겨 버렸다 가장 문제는 본가에서의 자가격리 7일 동안 팀원들과의 커뮤니케이션 문제인데 이걸 어떻게 하면 좋을지, 좋은 판단은 무엇인지 고민해야 할 것이다 우리 팀은 스카이스캐너라는 항공권, 호텔, 렌터카를 한 번에 할 수 있는 사이트를 모티브로 새로 기획하여 프로젝트를 만드는 것이다 프로젝트 명 : WeScanner 팀원 : 프론트엔트 3명, 백엔드 1명 담당 기능 : 메인 페이지, 리뷰 기능 이번 프로젝트에서는 기능 구현에 집중하고자 특별한 디자인이나 UI가 화려한 건 없는 거 같다 기능 구현에 필요한 데이터가 많고 1차 때보다 좀 더 복잡한 구조로 되어 .. 더보기 [Team Project] 쓰레빠 Threppa Project 2 mamuree~ 오늘 제로콜라 한잔 했습니다.. 드디어 2주간 팀 프로젝트, 쓰레빠 프로젝트를 마무리(manuree)했습니다 저희 팀은 다른 팀들보다 한 명이 적은 상태로 출발했습니다 팀원들 전부 mbti가 i로 시작하는 사람들이라 싫어도 싫은 소리 못 냈을 팀원분들 너무 고생 많이 하셨습니다 처음 해보는 팀 프로젝트, 그리고 딱 겹친 장마철의 습함 덕분에 불쾌지수도 올라가고 코딩의 열기도 올라가ㄱㅗ... 응?? 음악 하나 틀고 들으면서 마무리 스크롤 한번 내려보겠습니다 클릭클릭클릭클릭클릭클릭클릭클릭클릭 프로젝트 명 : 쓰레빠(Threppa) Project 팀 구성 : Front 3명, Back 1명 Github(깃허브) 본인 담당 : 제품 상세 페이지, 푸터 Demo 영상부터 보겠습니다 유튜브 영상 구성은 이렇습니다 .. 더보기 [Team Project] 크록스(Crocs) 1 기간 : 6월 20일 ~ 7월 1일 팀원: 프런트엔드 3명, 백엔드 1명 담당 페이지 : 상품 상세 페이지 HTML, CSS, Javascript 라이브러리 : React 중간 점검 제작 중 이번 주 5일 동안의 주요 기능 - 공식 홈페이지를 참고한 클론 레이아웃 - MockData를 이용하여 데이터 활용 - 캐러셀(슬라이드) UI 기능 구현 1. 공식 홈페이지를 참고한 클론 레이아웃 크록스 공식 홈페이지를 참고하여 레이아웃을 구성하고 HTML과 CSS를 적용시켜 보았다 처음부터 미디어 쿼리를 이용한 반응형을 제일 후위 순위로 놓았기 때문에 px단위를 사용하여 웹 pc 뷰에서는 UI가 늘어나거나 줄어 나지 않게 하였으며 이후 반응형 페이지 작업을 진행할 시 미디어 쿼리를 이용해서 단계별로 UI를 수정하는.. 더보기 인스타그램 클론코딩 로그인 페이지 부트캠프 수강 중 진행한 인스타그램 클론 코딩을 다시 봅니다 완성 여기서는 로그인 버튼 활성화와 비활성화, 그리고 아이디 유효성 검사를 하였습니다 const idInput = document.querySelector('.inputId'); const passwordInput = document.querySelector('.inputPassword'); const disabledButton = document.querySelector('.mainBtn'); 먼저 각각 ID input, Password input button에 변수를 담아줬습니다 ID input idInput.addEventListener('input', () => { if ((idInput.value !== "") && (idInput.v.. 더보기 [miniProject] google Momentum 만들기_02(React) 저번에 이어서 오랜만에 글을 올립니다 18일 자격증 시험이 있어 일단은 그것에 집중하느라 블로그를 쓸 시간이 없습니다 이어서 제가 한 걸 보겠습니다 검색 창 까지 봤었고 그다음은 현재 시간 시간 데이터는 자바스크립의 new Data라는 걸 이용하면 현재 표준시간을 전부 불러올 수 있습니다 // React // 현재시간 component function Nowtime() { let [realTime, realTimes] = useState(""); useEffect(() => { setInterval(() => { const now = new Date(); const hours = now.getHours(); const minutes = now.getMinutes(); realTimes(`${hours}:.. 더보기 [miniProject] google Momentum 만들기_01(React) 노마드코x님이 했던 클론 코딩 아님 구글 검색하다 블로그에 실시간 데이터를 가져오는 글이 있는데 보고 응용했는데 알고 보니 노마드코x님이 했던 클론 코딩에서 가져온 방법 중 하나였네요 시계 데이터 하나 빼고 혼자 처음부터 구현했다는 걸 알고 계시면 될 거 같습니다 많이 부족합니다 먼저 완성된 모습 보시고 가시죠 포트폴리오에는 사용한 기술 이런 거 적더라고요 그래서 저도 한번 적어봅니다ㅋㅋ! 사용 스택 HTML CSS (Sass) JS React React 프레임워크로 처음 만들어본 간단한 프로젝트입니다 먼저 react 뭔가 엄청 많이 깔려 있네요 나중에 블로그를 통해 react에 대해서 하나씩 배운 걸 공유하겠지만 저는 처음 써보는 거라 App.js에 모든 걸 넣었습니다 원래는 react는 이렇게 쓰면 .. 더보기 [miniproject] javascript로 blog 만들어보기 3(마무리) 지금까지 만들었던 blog 토이 프로젝트 마무리 전 페이지 참고 내가 배우고 응용 할 수 있는 것에 한계가 있는데 이 이상 시간을 질질 끌었다가는 오래 걸릴거 같아 DOM조작을 더 배우면서 다음 toy프로젝트를 만들어 보기로 결정! 그리고 추가 1. firebase라는 프로그램으로 JS이식? firebase는 쉽게 말하면 우리가 데이터를 저장하고 서버에서 받아오고 하는 것은 백앤드가 있어야 함 그것을 대신 해주는게 firebase Firebase(파이어 베이스) Firebase Firebase는 고품질 앱을 빠르게 개발하고 비즈니스를 성장시키는 데 도움이 되는 Google의 모바일 플랫폼입니다. firebase.google.com 간단하게 백앤드 없이 프론트앤드를 작업하기에는 용이하다고 하길래 튜토리얼 .. 더보기 이전 1 2 다음
