본문 바로가기
728x90

분류 전체보기104

[TIL] JavaScript - debugger 서론 이건 또 웨않되??? 버튼 클릭 시 onclick event를 줬는데 안 먹힌다... 두 번 더 클릭을 해야 먹히는 이 상황은 뭐징... 어디서 문제가 걸리는지 알고 싶은데 어떻게 해야 할지 모르던 상황에서 튜터님께서 도움을 주셨습니다!!! debugger debugger문을 활용하시면 JavaScript 코드의 실행 흐름을 따라가며 효과적으로 검증이 가능합니다. 사용법은 검증하고 싶은 코드 중간에 debugger문을 끼워 넣어주면 됩니다. 위 사진처럼 debugger를 넣은 위치부터 코드가 실행되는 흐름을 사용자가 원하는 대로 볼 수 있습니다. 이 방법으로 오류 메시지는 없지만 실행이 안 되는 부분, 어디서 꼬였는지 알 수 있습니다. 마치며... 오늘도 참 많은 오류들을 만났고... 같은 오류면 .. 2022. 11. 23.
[TIL] CSS - display : fixed 서론 프로젝트 D-3... 웬만한 기능들은 이제 구현이 되고있는 중입니다... 가장 쉬운 메인페이지 구현이면서 오늘에서야 완성을 해버렸....습니다...😭 사실... 100%완성은 아니구... NavBar 반응형까지 완성했으니까 다했다고 해주세요... 문제점 NavBar를 밑으로 내리고 싶은데 무슨 짓을 해도 안내려갑니다... display : flex를 써도 안되고... margin을 주자니 컴퓨터 해상도에 따라 크기가 다르기에 문제가 됩니다... 해결법 ( display : fixed ) 의외로 정말 간단했습니다... css에 display : fixed; 한 후 bottom : 0;을 주면 viewport bottom에 고정이 되게 됩니다... 마치며... 2022. 11. 22.
[TIL] JavaScript - innerHTML된 파일에서 함수 구현하기...? 이 타이핑 효과를 구현하기 위해서 많은 시행착오가 있었습니다... 혼자 고민 끝에 결론이 도출되지 않아 매니저님과 튜터님들께 자문을 구했습니다...😥 그냥 HTML에서 JS로 타이핑 효과를 구현하는 것은 성공했었습니다. 하지만 문제는 이번 프로젝트를 SPA방식으로 구현하여야 했고, 그 과정에서 main page를 innerHTML로 뿌려주면서 발생하게 되었습니다. 문제점 Hype Express index.html에서 모든 페이지들을 받아옵니다. 밑에 router.js에서 innerHTML을 이용하여 에 main.html을 뿌려줍니다. //router.js export const route = (event) => { event.preventDefault(); window.location.hash = eve.. 2022. 11. 21.
[WIL] 한 주를 돌아보며... 서론 전주 금요일부터 새로운 프로젝트가 시작되었습니다!! 로그인 & 회원가입 페이지와 CRUD를 구현하여 게시판 만들기가 프로젝트의 주제였습니다. 전주 금요일에 면접 일정이 잡혀서 부랴부랴 갔다 오느라 프로젝트에 늦게 합류를 하였는데 이해해주시고 진행 과정을 설명해 주셔서 팀원들께 너무 감사하더라고요...😂😂 본론 진행 상황 현재 저희 프로젝트의 메인페이지 진행상황입니다. 제가 맡은 파트는 메인 페이지 구현이고 디자인은 팀원분들이 제가 면접 갔을 때 회의를 걸쳐서 디자인했다고 합니다. Todo SPA , Firebase를 공부해서 프로젝트에 적용시켜야 합니다. 다른 부분들은 팀원들께서 잘하고 계시지만 서로 안되는 부분은 같이 공유하여 해결해 보려고 합니다. 마치며... 전주는 뭔가 한게 없는데 빠르게 지.. 2022. 11. 21.
[TIL] 1차 프로젝트 S.A Hype Express 1. 팀 소개 팀명: Hype Express 팀원: 박진양(팀장), 김예슬, 유영재, 한상권, 조영찬 2. 프로젝트 소개 제목: Hype Express 프로젝트 간단 설명: 여러분들의 공간에 hype함을 배달합니다. 우리 팀의 목표 남들보다 잘하자 각자 맡은 섹션을 소화하고 구현하고 이해하자 발라버리자 기능 모든 페이지를 반응현으로 디자인 각 카테고리별로 뉴스피드 구현 맘에 드는 피드 클릭시 좋아요와 스크랩 기능 추가 구현 로그인 / 회원가입 구현 로그인시 MY PAGE 로 이동시 아이디, 사진 수정할수 있는 설정 부분 구현 내가 쓴글과 좋아요로 구혁을 나눠 나의 자료를 볼수 있게 구현 파이어베이스를 활용한 백엔드 구축 AWS S3로 배포 3. 와이어 프레임 4. APIs 2022. 11. 18.
[CS] SPA !! SPA란? 싱글 페이지 애플리케이션(single-page application, SPA)은 서버로부터 완전한 새로운 페이지를 불러오지 않고 현재의 페이지를 동적으로 다시 작성함으로써 사용자와 소통하는 웹 애플리케이션이나 웹사이트를 말합니다. 이러한 접근은 연속되는 페이지들 간의 사용자 경험의 간섭을 막아주고 애플리케이션이 더 데스크톱 애플리케이션처럼 동작하도록 만들어줍니다. MPA vs SPA SPA는 한 개(single)의 Page로 구성된 Application이지만, MPA(Multiple page Application)는 여러 개(Multiple)의 Page로 구성된 Application입니다. MPA는 새로운 페이지를 요청할 때마다 정적인 리소스가 다운되며, 매번 전체 페이지가 다시 렌더링 되는 .. 2022. 11. 16.
728x90