본문 바로가기

전체 글

(35)
미니 프로젝트 - 1주차 중간 보고 0.  프로젝트 주제 선정팀 미니프로젝트의 조건 중에서 API를 받아오는 부분을 보고 https://www.data.go.kr/  (공공 데이터 포털) 에서 국립원예특작과학원 오늘의 꽃 조회 서비스 를 활용하여 꽃을 파는 서비스를 만들면 좋겠다 라고 생각하여 만들게 되었습니다.https://www.data.go.kr/tcs/dss/selectApiDataDetailView.do?publicDataPk=15084605무료로 예쁜이미지를 쉽게 찾을수 있는것도 한몫했습니다.1.  figma 로 대략적인 와이어 프레임 셋업 작업하기 조금 편하기 위해서 하고자 하는 프로젝트의 대략적인 레이 아웃을 짰습니다.일단 필수적으로 구현 할것을 토대로 짰습니다. 2.  프로젝트 셋업개발 환경을 조성하고 제일 기초버전을 se..
패스트캠퍼스 프론트엔드 개발 8기 부트캠프_미니프로젝트 미니 프로젝트 ?패스트 캠퍼스에는 프로젝트가 꽤 많이 있다.내가 지금 배우고 있는 프론트엔드 과정만 해도 두번의 개인 프로젝트 (라고 하지만 숙제에 가깝다) 두번의 토이프로젝트 그리고 대망의 파이널 프로젝트 전의 몸풀기 인 '미니 프로젝트'가 있다. 여태 팀 프로젝트는 프론트는 프론트 과정끼리, 백엔드는 백엔드 과정끼리 진행하는 거였는데웹 개발이 하나만 개발이 된다고 해서 개발이 되는것이 아니듯이!  드디어 프론트 와 백 이 만나서 프로젝트를 진행하는 것이다. 파이널 프로젝트의 몸풀기라고 말한것은 파이널때는 PM, UXUI, 프론트, 백 이 다모여서 하나부터 열까지 하는 프로젝트인데 그전에 프론트와 백이 합을 맞춰보는 연습이라고 할 수 있겠다. 프로젝트 OT아무래도 서로의 의사소통이 중요한 만큼, 프로젝..
유저플로우
중간보고 ! 파이어베이스 연결필드는 조금 더 추가될 예정 입니다!https://github.com/PenguinKKIM/poke-trainer/commit/25b6bf8fdad372a74939744ebcc03aaff0a2278e폼도 필드가 추가됨에따라 더 추가될 예정이구요.그냥 소소하게 이름 나타나게했습니다.네비게이션도 조금 귀엽게 구성해봤습니다!
패스트캠퍼스 프론트엔드 개발 8기 부트캠프_그룹스터디 그룹스터디?개발 공부 하다 보면 가장 많이 접하게 되는 활동 중 하나가 그룹 스터디라고 생각한다. 내가 처음에 개발 공부하면서 가장 크게 착각했던 것이 고등학교 다닐 때 수능 공부 하는 거처럼 혼자 열심히 공부하는 그런 거였다.늘 어디선가 접한 개발자들 (?)에 대한 고정관념이라고 해야 할까... 방에 틀어 박혀서 혼자 열심히 개발하는 그런 이미지가 있었기 때문에 ㅎㅎ;;;  막상 공부를 시작해 보니까, 개발자들이 다들 엄청 활발하게 네트워킹하고 서로 코드도 보면서 공부하는 걸 알게 됐다. 그룹 스터디 형식은 진짜 다양한데,비슷한 주제로 작성한 코드를 서로 보면서 회고나 코드 리뷰를 하거나,같은 책을 보면서 한 챕터씩 정리해서 발표하는 북 스터디도 있다.각자 하고 싶은 스터디 방향이 달라서 처음에 그룹 ..
[css]text - shadow generator 스트로크를 구현 해 보셨나요..?포토샵이나 피그마에서 작업할때는 진짜 세상 쉬운 아무것도 아닌! 작업 이긴 하다만...이거를 CSS로 구현할려면 진짜 대환장할 일 이다.아마 CSS로는 이미지 편집툴 들 처럼 세세하게 설정할수가 없어서 그런거같은데...   간단히 3픽셀 정도의 테두리를 만들고 싶다면, 이미지 편집툴에선 색상을 정하고 딸깍 한번이면 되지만!CSS 에서는 코드가 이마마마마큼 길어진다 text-shadow: rgb(233, 233, 233) 3px 0px 0px, rgb(233, 233, 233) 2.83487px 0.981584px 0px, rgb(233, 233, 233) 2.35766px 1.85511px 0px, rgb(233, 233, 233) 1.62091px 2.52441..
타입스크립트 복습하기 //리턴 타입을 지정해주지 않아도 타입스크립트가 추론해준다function add (a:number, b:number){ return console.log(a+b);}//같은 로직의 arrow const addArrow = (a:number, b:number) =>{ return console.log(a+b);}addArrow(1,3);//numberType 이라는 타입을 만들어 지정//이렇게 쓰면 다른데에서도 쉽게쓸수있지않을까 ?type numberType = (a:number, b:number) => number;//인자 이름은 어차피 그냥 이름이라 바뀌어도 상관없다.const useAdd : numberType = ( a, b ) =>{return (a+b) };const useMinus : nu..
프로젝트 진행 시 필요한거 마구적기 1. Vite의 사용 제대로 하고있는지는 모르겠는데.... .eslintrc.cjs 의 설정을 자세히 들여봐야겠다 뭔가 모듈화 나 환경설정은 편한거같다..! 2. 유저 플로우 다시 작성하기 흐름이 헷갈리니, 나부터 횡설수설 하게된다 주말에 새벽에 한번..? 3. 페이지네이션 작성 다른 희준님이 해주고계신거같은데... 일단 기능이되면 MUI같은거 써서 함 해보자고 한다. 4. 글로벌 스타일에서 작업해야할것 글로벌스타일 : 하나 완료하면 하나까먹음 Button에 모서리 둥굴게 추가하기 ㅎ 5. 후추