멋사스쿨_ 참고사이트_끄적끄적

jellyjoji·2023년 5월 31일
0

개발자

  • 개발분야는 영어가 필수다.
  • 개발자는 워닝은 무시하되 에러는 잡아야한다.
  • 지식은 알고있을때와 모를때 흡수율이 다르다.
  • 개발은 패턴과 규칙이 있어서 자동화 시킬수있어야한다.
  • 외울려고 하지말고 논리적으로 추론하고 이해하려고 노력하는게 개발자. 모든데는 이유와 근거가 있다.
    inherit 속성이 되는것과 안되는것의 이유를 추론하고 합리적인 이해를 해라.
  • 모르면 코드로직이 복잡해지는것이고 그러면 손발이 고생한다.
  • 코드 리뷰때 논리적으로 모두 설명할수있어야한다.
  • 까이고 싶지 않으면 내가 하는일이 얼마나 가치있는지 다른직군에 이해시켜야한다.
  • 좋은 질물해서 좋은 답변하는 연습을 해야한다.
  • 설계가 중요하다. 설계없이는 집을 지을수없다.
  • 오래 개발자로 일하려면 빠른것보다 제대로 아는것이 중요하다.
  • 경험으로부터 원인 파악을 잘하고 대처를 빨리하는게 시니어 개발자이다.

접근성 SEO

  • 처음부터 쉽게 가지말고 어렵게 사용성을 고려해서 시멘틱태그하라.
  • 모든 컨포넌트는 재활용 가능한 부품화 시키기.
    사전의 기초공사를 소홀히 하지 말것. 노가다 같은 변수와 테마 설정하는것이 중요.
  • 마크업 구조는 논리적인 구조로 위에서 아래로 선형화해야한다.
  • 네이밍 패턴 통일 시키기
    파스칼 혹은 타이틀 BrandLogo
    카멜 brandLogo
    케밥 brand-logo
    스네이크 brand_logo
  • 네이밍 규칙 분리 id 는 카멜 / class 는 케밥 으로 모양만 봐도 구분되도록 정하면 협업이 쉽다.
  • mobile first
    cascade 폭포 성능관점에서 mobile first 방식이 적절하다.
  • 시멘틱보다 중요한건 접근성과 사용성.
  • 웹접근성 백로그 (반드시 지킬점) 정해서 배포하기

깃헙

  • 깃헙에 저장소 내용을 쉽게 이해시키는 설명이 잘 되어있는 마크다운 README 가 있어야한다.
  • 저장소의 제목, 스크린샷, 설명, 소제목, 목차 등등을 포함시켜라.
  • 이듬 영상강의 틈틈히 듣기.
  • 깃 충돌났을때 수작업으로 수정해줘야한다.
  • README.md 에 내 코드 왜 이렇게 짯는지에 대한 자세한 설명과 완성본 스크린샷 함께 찍어 올려야한다.

터미널

  • 터미널에서 아무 메세지가 없으면 잘되고 있는것이다.

자바스크립트

  • 라이브러리 남발 금지.스스로 설계해야한다. 그리고 재활용 가능한 단위로 만들어야한다.
  • 함수만들때 꿀팁 : 코드짜기전 실행부 먼저 작성하기
//실행부 미리써보기
// getCss(누구의 css를 가져올것인가?, h1의 '색상을 가져올것'); 
getCss(h1,'color');

리엑트

  • 리엑트는 자바스크립트이다.
  • xhtml 쓰는게 리엑트 사용에 쉽다.
  • 태그 생성시 필수 속성들은 자동완성으로 나온다.

CSS

  • css는 어디가 문제라고 알려주지 않아서 어렵다.
  • html 에서는 0부터 시작하고 css 에서는 1부터 시작한다.
  • 세로모드 : portrait 가로모드 : landscape

블로그

  • 블로그에 수업 내용 따라적고 스크린캡처 올려놓기만 하면 감점이다. 수업 내용을 재해석하는것이 중요하다.
  • 처음부터 레퍼런스 읽으면 이해가 안된다. ui를 만들어봐야한다.

장애 경험 UX

  • 장애는 당사자가 아닌 환경의 문제다.
  • 온라인 장애는 서비스 개발 과정에서 모든 사용자를 고려하지 않아 나타나는 서비스의 결함, 서비스의 단절이다. 오프라인 장애가 온라인 장애로 연결되지 않는 IT 환경을 만들어야한다.

안티패턴

  • 시멘틱 전역타입 패턴에 div, ul 등이 하나만 쓰인다는 법이 없기 때문에 id 나 class 에 css 를 적용시키는게 낫다.
  • 통일성없는 개발언어
  • 기준없는 그룹핑
의미없는 그룹핑은 복잡해지는 원인
  • 중복된 컴포넌트 생성
  • 새로운 프로젝트

레거시 코드란

더 이상 쓰기 힘들거나 화나게 만드는 코드.
그래서 개발자가 변경하기를 두려워하는 코드.
레거시
레거시

참고사이트

emmet cheat sheet

cheat sheet

모니터 해상도 알려주는 웹사이트

모바일에서도 바로 모바일 사이즈 재어줌.
mydevice

문법 검사 홈페이지에서 에러 체크하기

문법 검사 홈페이지에서 에러 체크하기

마크다운 markdown 작성법

마크다운 markdown 작성법
마크다운-문법-💯-정리

접근성 높은 코드 참고

ARIA Authoring Practices Guide (APG)

잘된 포폴 예시 참고

jelly's notion

유니코드 예쁘게 변환 폰트

편리한 화살표 폰트. 반드시 로컬 폰트로 설치할것
fira code

git Commit message 규칙

[git Commit message](> https://velog.io/@jiheon/Git-Commit-message-%EA%B7%9C%EC%B9%99)
깃 라벨 예시

0개의 댓글