본문 바로가기

위코드23

img 위코드 3개월 과정 회고 반갑다 ! 나는 위코드 34기 하상원이다. 나는 변변찮은 컴퓨터 공학부 학생이었다. 개발자가 된다는 생각도 딱히 없었고, 학교에서도 맨날 술먹고 놀기만 했다. 졸업 후 그저 그런 중소기업에 갔는데, 개발 말고도 여러 잡일을 시켰었다. 그리고 그 때 알았다. 난 확실히 개발이 더 재밌고 적성에 맞는다 ! IT회사에서 개발자가 되고 싶어서 이전 회사를 다니며 이곳 저곳 면접을 봤다. 하지만 어림도 없지. 전공 지식은 희미하게 개념만 기억나고, 포트폴리오에서 내가 맡은 파트가 기억나지 않았다. 아무리 서류를 잘쓰고 인성 면접을 잘 봐도 내 코딩 지식이 텅텅인걸 매번 탄로났다 ! 공부가 필요했다. 하지만 난 혼자 공부를 잘 못한다. 공부하는 습관조차 전혀 들여져 있지 않다. 혼자 공부하면 핸드폰 시간 4시간에 .. 2022. 8. 22.
img 위코드 2차 프로젝트 후기 Github 링크 : https://github.com/wecode-bootcamp-korea/34-2nd-whataboutme-frontend GitHub - wecode-bootcamp-korea/34-2nd-whataboutme-frontend: 김민석, 안유주, 하상원 김민석, 안유주, 하상원. Contribute to wecode-bootcamp-korea/34-2nd-whataboutme-frontend development by creating an account on GitHub. github.com 위코드 2차 프로젝트 후기 2차가 끝나고, 기업 협업에서 새로 배우는 기술을 공부하고, 흩어지는 동기들과 아쉬운 회식도 하느라 좀 늦게 작성하게 되었다. 2차 프로젝트 나에게 2차 프로젝트는 .. 2022. 8. 21.
img 위코드 1차 프로젝트 후기 https://github.com/wecode-bootcamp-korea/34-1st-Wish-Korea-frontend 위시 코리아 프로젝트는 러쉬 홈페이지를 React를 사용해서 클론 코딩했으며, 프론트엔드 4명, 백엔드 1명 구성인 팀으로 저는 상세 페이지를 맡아 구현했습니다. 상세 페이지 구현 상세 페이지는 백엔드에서 데이터를 받아옵니다. 리스트 페이지에서 path parameter로 주소가 넘어오면 useParams를 사용하여 상품 id를 받아오고 그 id를 fetch할때 입력하여 데이터(상품)를 객체 형식으로 받아옵니다 객체에는 {상품 id, 상품명, 상품이미지, 옵션[ {옵션아이디, 상품크기, 상품가격, 재고, 옵션이미지} ] } 가 들어오며 그 데이터를 이용해 페이지를 구성했습니다 ! ! .. 2022. 7. 4.
img Wish Korea 프로젝트 (Lush 클론 코딩) - 상세 페이지 https://github.com/wecode-bootcamp-korea/34-1st-Wish-Korea-frontend 위시 코리아 프로젝트는 러쉬 홈페이지를 React를 사용해서 클론 코딩했으며, 저는 상세 페이지를 맡아 구현했습니다. 상세 페이지는 백엔드에서 데이터를 받아옵니다. 리스트 페이지에서 path parameter로 주소가 넘어오면 useParams를 사용하여 상품 id를 받아오고 그 id로 데이터(상품)를 객체 형식으로 받아옵니다 객체에는 {상품 id, 상품명, 상품이미지, 옵션[ {옵션아이디, 상품크기, 상품가격, 재고, 옵션이미지} ] } 이런 형식으로 들어옵니다. 옵션이 한 개일 때와 여러 개일 때를 구분하여, 한 개일땐 바로 수량 칸을 나타냈고, 받는 데이터에서 바로 옵션에 수량 .. 2022. 7. 3.
img westagram project(인스타그램 클론 코딩) - 메인 화면 (2) 메인 컴포넌트 구성 이번에는 Feed.js 와 그 하위 컴포넌트인 Comment.js, CommentHeart.js, InputCommentLine.js 를 보겠습니다 ~! Feed.js import React from 'react'; import Comment from './Comment'; import Member from './Member'; import InputCommentLine from './InputCommentLine'; import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; import { faHeart, faComment, faPaperPlane, faBookmark, } from '@fortawesome/free-regu.. 2022. 7. 3.
img westagram project(인스타그램 클론 코딩) - 메인 화면 (1) Main.js 컴포넌트 구성 메인 화면 구성을 위해서 컴포넌트를 나눠보았습니다. 처음으로 컴포넌트를 여러 개를 사용했고, 시작 단계에서 제대로 나누지 않고 들어가서 컴포넌트를 나누는데에 어려움이 있었습니다. 어쨌든 결과적으로 나온 컴포넌트는 이렇습니다. Main.js import { React, useState, useEffect } from 'react'; import './Main.scss'; import Navbar from '../components/Navbar'; import Feed from '../components/Feed'; import Rightbar from '../components/Rightbar'; export default function Main() { const [comme.. 2022. 7. 3.
반응형