chart.js React에 적용하기
·
Programming/React
드디어 chart.js를 적용해보았다.이미 기본 스타일, 애니메이션이 적용되어 있어 너무 만족스럽게 적용하였다.다른 프로젝트에 적용할 땐 헤매지 않도록 말끔하게 정리해보자. 1. 터미널에서 chart.js 다운받기 npm install chart.js react-chartjs-2 2. ChartComponent.js 컴포넌트 작성하기나는 제목, Bar, Grid 스타일을 수정했다. return은 Bar 태그에 props만 전달하면 되었기에 매우 간단하다.import {  Chart as ChartJS,  CategoryScale,  LinearScale,  BarElement,  Title,  Tooltip,  Legend,  ChartOptions,} from "chart.js";import { Bar..
단일 Modal 컴포넌트 props 사용해서 수입/지출 내역 관리하기 [Warning: React does not recognize the modalColor prop on a DOM element.]
·
Programming/React
개인 프로젝트의 묘미는 기능과 코드를 내 마음대로 할 수 있다는 것! 인턴십 전까지 남아 있는 시간동안 개인 프로젝트를 할 수 있는 시간이 있어서 다행이다.역시 사람이 여유가 조금 생기니, 만들어 보고 싶었던 기능, 시도해보고 싶은 것들이 떠오르네.. 참 신기해.. 중복 파일, 코드를 최대한 줄여보고 싶은 마음에, [수입], [지출] 버튼을 눌렀을 때 나오는 RegistModal을 하나의 파일에서 적용 해보기로 하였다. 수입 모달과 지출 모달의 차이점1) 제목2) 색상3) input placeholder4) [등록하기] 버튼 클릭 시, props 전달 내가 적용한 방법은 아래와 같다. 1. 지출을 기준으로 상태를 초기화한다.  const [modalColor, setModalColor] = useStat..
2024 하반기 ICT 국내 인턴십 합격 후기
·
etc.
내 일지를 기록하고, 추후 ICT 인턴십에 참여하고 싶은 사람들에게 조금이라도 도움이 되길 바라며 작성한다. 올해 4월에 학점을 인정해주면서 인턴 과정에 참여할 수 있다는 프로그램인 ICT 인턴십이라는 걸 알게 되었다. 학교 안에 산학 인턴 과정은 알고 있는데, 이건 56개 대학(이번년도 기준)에 속하는 학교 재학생들이 참여할 수 있는 프로그램이다. 우리 학교에서는 4월에 설명회를 개최하였는데, 관련 공대 학생들이 중형 강의실을 다 채울 정도로 많이 참여하였다. 매년 경쟁률도 높아지고, 대부분의 기업들이 1,2명씩만 인턴을 뽑기 때문에 잘하는 사람이라도 운에 따라 결정될 것 같아 되기 어려울 거라고 생각을 했었다. https://ictintern.or.kr/main.do ICT 학점연계 프로젝트 인턴십I..
기존 프로젝트에서 React-Native-CLI 실행하기 (+Window, Android Studio, VScode)
·
Programming/React-Native
선배님들이 만드셔서 대대로 학생들이 개발, 운영하고 있는 약 7000명의 이용자가 있는 학교 자체 커뮤니티 앱 개발 FE팀에 합류하게 되었다. 내 학창시절 로망(?)이 학교 학생들이 만들고 실제로 운영되고 있는 서비스의 개발을 하는 것이었다. 이 꿈을 나름 빨리 이룰 수 있게 된 것 같아 기분이 날아갈 듯 했다. 실행을 하기 전까지... 이 서비스가 React-Native로 만들어진 건 들어오기 전부터 알고 있던 사실."React-Native를 해본 적은 없지만 여태 그래 왔듯 열심히 할 수 있습니다!"React는 해봤으니까 뭐 별 다른게 있겠어? 라는 마음으로,,포부만 넘쳤지,,, 실제로 운영되고 있는 서비스의 프로젝트 용량과 실행은 호락호락하지 않았다. 시간상은 3일동안 트슈를 겪고, 다른 프로젝트에..