분류 전체보기
-
[ToyProject-Todomate] 투두메이트 클론 프로젝트 38WEB Dev/ToyProject 2022. 3. 21. 23:25
🔷 CloneTodo ☑ - Todomate Clone Project | Team CloneMate CloneTodo : 많은 사람들이 사랑하는 투두메이트를 클론하여 웹 서비스를 배포해보는 프로젝트 와우 엄청 오랜만에 토이프로젝트 문서를 작성해본다. 그동안 작업을 안한 건 아니고 글을 적는 시간에 빨리 개발을 해야겠다는 생각에 글을 좀 자제했다. 그동안 한 일은 1. 투두를 클릭했을 때 띄워지는 모달의 모든 기능을 구현 - 수정, 내일하기, 날짜바꾸기, 순서변경, 삭제 수정, 내일하기, 날짜 바꾸기, 삭제 기능을 구현했다. 그리고 순서 변경을 별도 페이지로 리디렉션해서 순서를 변경하도록 해야하는데 이 로직이 조금 복잡해서 백엔드 팀원분과 나중에 같이 작업하기로 했다. 드래그 라이브러리를 사용해서 대충 만..
-
[에러대백과] Your branch is ahead of 'origin/main' by 1 commit.WEB Dev/에러대백과 2022. 3. 16. 11:17
오늘의 error Your branch is ahead of 'origin/main' by 1 commit. 발생현황 기존에 회사 노트북의 로컬 폴더를 통해 git 백업을 진행했는데, 재택근무와 회사 근무를 병행하게 되면서 회사 노트북과 개인 노트북을 둘 다 사용해야 하는 일이 발생했다. 회사에 회사 노트북을 두고 집에 와서 서버에서 파일 받아 쓰려니 (권한 때문에 깃은 백업용으로만 사용 ^^^) 갑작스럽게 깃허브 에러가 발생했다. 번역기를 사용해서 해석해보자면 ! [rejected] main -> main (fetch first) error: failed to push some refs to 'https://github.com/0000/0000.git' hint: Updates were rejected..
-
[HTML] blockquote 태그 알아보기WEB Dev/HTML | CSS 2022. 3. 14. 10:48
마크업 프로페셔널로 거듭나기 tobyyun 님의 마크업 개발 레벨 테스트 질문을 통해 마크업 역량을 키워보자 ψ(｀∇´)ψ 마크업 개발 레벨 테스트 질문 팀의 막내 개발자의 마크업 개발 역량 확인을 위해, 마크업 개발 레벨 테스트용 질문을 만들어 보았습니다. 제가 마크업 개발자를 뽑는 면접관 역할을 하게 될 때에 사용하는 질문들과도 유사한 tobyyun.tumblr.com 질문 blockquote 태그는 어떤 용도로 사용해야 할까요? 답 blockquote는 block과 quote라는 영단어 두 개를 합성한 합성어로 만들어진 태그다. quote는 인용문이라는 뜻으로 다른 문서의 글이나 다른 사람의 말을 가져와 사용하는 것을 인용이라고 한다. 일반적으로 태그에서는 i 태그와 같은 텍스트를 강조하는 방법을 ..
-
[에러대백과] Expected an assignment or function call and instead saw an expressionWEB Dev/에러대백과 2022. 3. 9. 14:02
오늘의 error 리액트 Expected an assignment or function call and instead saw an expression 할당 또는 함수 호출을 예상했지만 대신 식을 보았습니다. 발생현황 함수에서 return 으로 jsx를 반환할 때 컴포넌트를 감싸는 큰 태그가 없을 때 나타나는 에러이다. 이 경우 return 의 태그들을 div 태그나 Fragment 태그로 감싸주면 된다. 여기서 Fragment 태그는 리액트에서 사용되는 '의미 없는' 태그로 div 처럼 시맨틱적인 의미가 있는 태그를 사용하게 되면 이것을 인식하고 메모리를 사용하기 때문에 반드시 필요한 경우가 아니면 Fragment 태그로 감싸서 처리한다. Fragment 태그는 로 쓰거나 간단하게 로 사용할 수 있다. ..
-
[HTML] block속성과 inline 속성WEB Dev/HTML | CSS 2022. 3. 5. 17:53
마크업 프로페셔널로 거듭나기 tobyyun 님의 마크업 개발 레벨 테스트 질문을 통해 마크업 역량을 키워보자 ψ(｀∇´)ψ 마크업 개발 레벨 테스트 질문 팀의 막내 개발자의 마크업 개발 역량 확인을 위해, 마크업 개발 레벨 테스트용 질문을 만들어 보았습니다. 제가 마크업 개발자를 뽑는 면접관 역할을 하게 될 때에 사용하는 질문들과도 유사한 tobyyun.tumblr.com 질문 block 요소와 inline 요소에 해당하는 태그들을 각각 5개씩 적어보세요. 답 1. 블록 Block 요소란? 우선 이런 것들의 정확한 설명은 W3C나 MDN에서 확인할 수 있다. 기본적으로 block 요소는 '블록 레벨 요소 Block Level Element' 라고 말할 수 있다. 블록 레벨 요소는 부모 요소의 전체 공간을..
-
[HTML] <strong>, <em> 태그 이해하기WEB Dev/HTML | CSS 2022. 3. 3. 17:47
마크업 프로페셔널로 거듭나기 tobyyun 님의 마크업 개발 레벨 테스트 질문을 통해 마크업 역량을 키워보자 ψ(｀∇´)ψ 마크업 개발 레벨 테스트 질문 팀의 막내 개발자의 마크업 개발 역량 확인을 위해, 마크업 개발 레벨 테스트용 질문을 만들어 보았습니다. 제가 마크업 개발자를 뽑는 면접관 역할을 하게 될 때에 사용하는 질문들과도 유사한 tobyyun.tumblr.com 질문 웹표준에 맞게 작업할 때 b, i 태그 대신 적합한 태그는 각각 무엇일까요? 답 초등학교 때 나모웹에디터 같은 프로그램으로 홈페이지를 만들 때 를 많이 썼었다. 그런데 개발자가 되기 위해 다시 마크업을 공부하니 더이상 는 쓰지 말고 을 쓰라고 했다. 1. 와 는 원래 어떤 태그였을까? 는 bold, 는 italic의 약자를 사용한..
-
[HTML] Doctype 이란 ?WEB Dev/HTML | CSS 2022. 3. 3. 00:19
좋은 마크업 공부 자료를 구하게 되어서 순서대로 하나씩 작성해보려고 한다. 마크업 프로페셔널로 거듭나기 tobyyun 님의 마크업 개발 레벨 테스트 질문을 통해 마크업 역량을 키워보자 ψ(｀∇´)ψ 마크업 개발 레벨 테스트 질문 팀의 막내 개발자의 마크업 개발 역량 확인을 위해, 마크업 개발 레벨 테스트용 질문을 만들어 보았습니다. 제가 마크업 개발자를 뽑는 면접관 역할을 하게 될 때에 사용하는 질문들과도 유사한 tobyyun.tumblr.com 질문 Doctype을 사용하지 않을 때는 무슨 일이 발생할까요? 답 쉽게 독타입이라고 부르는데 HTML 문서 만들때 그냥 무의식적으로 넣어야 하는 코드로 알고 있었다. 아래에 차근차근히 독타입이 무엇인지, 없으면 어떤 일이 발생하는지 레퍼런스와 함께 알아보자 1..
-
[에러대백과] ajax에서의 "parseerror"WEB Dev/에러대백과 2022. 3. 2. 17:32
오늘의 error "parseerror" 발생현황 세션을 인식하고 DB에 회원정보를 업데이트 하는 코드에 문제가 생겼다. 사용자가 로그인을 하자마자 세션 값을 iframe에 넘겨주지 않기 때문에 값이 없어 DB에 undefined가 발생했다. 세션이 있을 때만 해당 업데이트 함수를 실행하도록 위치를 바꿔 주었는데 에러가 발생했고 확인해보니 jqXHR에 "parseerror" 라는 메시지가 떴다. 이 오류를 겪는 대부분의 사람들이 말하는 것은 dataType 오류라는 것. 위의 오류 메시지를 봐도 status는 200인데.... 그래서 ajax에 dataType을 추가해주니까 ajax에서 에러를 받아오지는 않았다. jQuery.ajax({ url: `주소` , type: "GET" , processData..
-
[Node.js] sharp 로 이미지 리사이징 해서 multer로 업로드 하기WEB Dev/Javascript | REACT | Node.js 2022. 2. 24. 11:45
회사에서 만든 커뮤니티의 이미지 업로드 스펙을 계속해서 변경해왔다. 최초 개발은 외주로 진행했는데 대부분의 스펙을 기존 리뷰 페이지의 스펙을 가지고 와서 개발을 했다. 그런데 사용자 경험 상 이슈가 다양하게 발생하여 현재 커뮤니티 이미지 업로드 문제에 오래 매달리고 있는데, 현재 진행하는 이미지 리사이징 프로젝트에 대해서 기록하려고 한다. 최초 개발 1MB 제한으로 4개까지 업로드 할 수 있도록 제한 / 1개씩 개별 선택 ▶ 최초 개발 시 서버 용량과 로딩 속도에 대한 이슈로 1MB 제한을 걸어두었다. ▶ 모바일에서 바로 업로드 할 경우 이미지 업로드 시 하단의 크기 선택을 이용해 사용자가 직접 크기를 줄이지 않는 이상 1MB 이내로 커뮤니티 이미지 업로드 불가 ▶ 이미지 용량이 생각보다 커서 1MB 제..
-
[에러대백과] Uncaught SyntaxError: Unexpected token u in JSON at position 0WEB Dev/에러대백과 2022. 2. 23. 13:34
오늘의 error Uncaught SyntaxError: Unexpected token u in JSON at position 0 발생현황 sessionStorage에 있는 값 받아 사용하기 위해 JSON.parse 하였으나 해당 오류 생성 해결 1. 오타 있는지 확인 2. sessionStorage 가 정상적으로 받아와졌는지 확인 - 나의 경우 iframe에서 session을 사용하면서 세션을 끊어버림... 크롬에서 로그인시 세션 만료 에러 (iframe 때문?) 크롬의 행보와 매번 부딪히게 되네요.. 크롬이 http 를 지양하고, https 를 지향한다는 것은 이미 알려진 사실이구요. 최근에 크롬이 CSRF 를 이유로 iframe 을 사용할 때 세션을 끊어먹는(실제로는 쿠 jsp-making.tist..