Programming/Project 13

[Figma] 기초적인 Figma 정리

팀프로젝트의 첫 단계, ui 설계를 위해 피그마를 배우기로 했다. udemy의 웹디자인 강의를 결제해두었는데 이제 정말 들을 때가 되었다. 기초 기능을 다루는 방법을 정리하며 강의를 들어야겠다. 1. 프레임 (단축키 f) - 화면 크기 정하기 (아이폰, 데스크탑 등등, 또는 개인설정 가능) - 프레임 안에 2개 이상의 도형을 하나의 그룹으로 만들기 위해서는 command+g 또는 shift 누르고 클릭 - 그룹을 해제하기 위해서는 shift+command+g - 프레임 안 오브젝트에 제약조건을 추가할 경우 프레임의 변화와 관계 없이 그대로 있음 2. 기본 도형 - 직사각형(R), 라인(L), 화살표(shift+L), 원(o), 다각형, 별, 펜툴(p) - shift를 누를 경우 정사각형, 8방향의 라인,..

Programming/Project 2024.01.18

[스마트오더] 팀 프로젝트를 시작하다

리액트 강의를 거의 다 들었을 무렵부터 인프런과 홀라에 올라오는 팀프로젝트 게시물을 유심히 보기 시작했다. 개인프로젝트부터 하는게 순리인 것 같기도 하지만, 괜히 팀플로 더 멋진 결과물을 만들고 싶은 느낌. 인프런에 올라온 글을 보고 문의를 몇 번 했으나 매번 next.js나 typescript라는 조건 때문에 참여를 못했다. 그러나 이번에 올라온 글에는 언어가 명시되어 있지 않아 문의를 넣었다. 다행히 아직 언어를 정하기 전이어서 이미 합류해 계신 프론트엔드분과 협의하여 자바스크립트로 개발을 진행하기로 했다. 이 팀에서는 실력보다는 인성과 태도 부분에서의 3가지 요소를 보았고 그 부분은 모두 자신 있었다. 많은 시간을 투자해서 부족한 실력을 잘 메워야지. 이 팀은 디자이너가 없어서 ui 개발을 다같이 ..

Programming/Project 2024.01.16

[프로젝트] 유튜브 클론코딩

결과물 HTML과 CSS 강의만 듣다가 처음으로 클론코딩을 해보았다. 처음에는 아무런 참고영상 없이 만들어서 코드가 복잡했는데 참고영상을 보면서 다시 하나하나 따라서 만들어보았다. HTML 코드 Youtube #NatureVideo #Mountain #Snow Lorem ipsum dolor sit amet, consectetur adipisicing elit. Libero, facilis provident. Ipsa, nam. 1M views 1 months ago 1K 0 Share Save Report .info { padding: var(--padding); } .info .metadata .hashtags { display: flex; font-size: var(--font-small); col..

Programming/Project 2023.11.06