새벽에 하는 DevOps 삽질기록

const를 이용한 구현법const myComponent = () => { } function을 이용한 구현법function myFunction() {} 작동은 똑같이 하는데 차이가 있을까?   const가 더 짧다는 것 외에 차이점을 알아보자. 1. Hoisting 선언하기 전 사용하고 싶다면 function을 사용해야 한다.const myConst = () => { }function A() {}function B() {} 일단 지금 차이점은 여기까지. 개인적으로 const사용법이 더 짧고 간결해서 좋다.

프론트 연구 노트 2024. 7. 11. 10:45

next js를 사용하여 프로젝트를 생성할때 아래와 같은 오류가 발생할때 해결법. 5번째 줄에서 lstat뒤의 경로를 복사하여 여기서 npm만 제외하고 파일탐색기에 붙여넣기내 경우에는 "C:\Users\cuu02\AppData\Roaming"이 경로였다.       그리고 해당하는 폴더로 이동하여 "npm"이라는 새로운 폴더를 생성해주면된다.왜 자기 혼자는 못 만드는거지??    모르겠지만 어쨌든 만들면 nextjs프로젝트를 작동하는 명령어가 정상수행된다.

프론트 연구 노트 2024. 7. 3. 18:42

마지막 글이 2023년 10월인것이 실화입니까? ㅎㅎㅎㅎㅎ 저는 아직 같은 회사에서 프론트 개발자로 일하고 있습니다. Ops에 관한 열망은 개인프로젝트로 채우고 있지요.개인프로젝트 진행상황은 linked in에 간간히 소개하고 있는데 블로그에도 신경을 좀 써야겠습니다https://kr.linkedin.com/in/seabyeok-chu-1217b21b6?trk=public_post_feed-actor-image 최근 쉐어하우스 오픈(..두둥!!)을 준비 + 회사에서 가족같은 사람을 만나 고생하는 바람에 어찌저찌 4개월만에 글을 씁니다 ㅎㅎ     jQuery로 만들어진 코드를 Refactoring해봅시다최근 jQuery로 만들어진 코드를 React로 Refactoring하는 임무를 맡게 되었어요. Ref..

프론트 연구 노트 2024. 1. 25. 11:28

Ag grid는 편리하게 표를 그리게 해줄 수 있는 도구이다. 자바 스크립트 기반이기 때문에 Angular, View, React 등 자바스크립트를 기반으로 하는 웹 프레임워크에서 사용할 수 있다. https://www.ag-grid.com/ Data Grid: AG Grid: High-Performance React Grid, Angular Grid, JavaScript Grid AG Grid is a feature rich datagrid designed for the major JavaScript Frameworks. Version 30. 0. Download v30 of the best Data Grid in the world now. www.ag-grid.com 현재 회사에서는 Enterpris..

프론트 연구 노트 2023. 6. 21. 09:44

마지막 글이 10월 이다.(면목없음) 근황을 이야기 하자면 여전히 같은 자리에서 잘 먹고 잘 사는 중입니다. 달리기는 조금 덜하고 지방층은 두꺼워졌지만 계속해서 같은 일을 하고 있습니다. 조금만 더 있으면 2년이 된다 .. !! 2년이라니 !! 나이가 먹으면서 세월이 무정하다는 말을 실감하게 되는 요즘. 같은 개발업무에 권태감이 찾아왔다. 나에게 권태감과 후회와 같은 감정들은 죽음처럼 공포스럽다. 정말 왜 이렇게 불안한지 누구 바짓가랑이 붙잡고 물어보고 싶은 마음이다.(ㅋㅋ) 각설하고, 돌아가는 프로그램은 같은데 (심지어 기능도 비슷) 테스트를 수동으로 진행하다보니 여기저기 빵꾸가 나는 부분이 많아 이참에 "Auto Testing" 이라는걸 해봐야 겠다고 생각했다. 자 그러면 내가 왜 auto testi..

프론트 연구 노트 2023. 2. 2. 11:08

const [open, setOpen] = useState(false); React hook구조는 useState를 제공한다. this.state = { open : flase }; //위의 open 변수 this.setState = { { open : true } }; //위의 setOpen 변수 위 처럼 선언을 하게되면 Class구조에서 open이라는 변수의 state를 선언하고 setState함수를 좀 더 편리하게 사용할 수 있게 해준다. Hook에서 toggle을 구현하는 방법 그래서 hook을 이용하면 toggle함수를 선언하기가 편했다. 나는 아래처럼 사용해서 toogle을 구현했다. function useToggle() { const [open, setOpen] = useState(false..

프론트 연구 노트 2022. 7. 29. 10:00

CSS를 사용하면 강제적으로 프린터의 레이아웃을 고정시킬 수 있다. 바로 아래와 같은 형태의 코드를 사용하면 된다. @media print { @page { size : landscape } } 본래 Chrome에서 프린트를 하게 되면 이전에 프린트했던 옵션을 기억하고 있어 그대로 사용할 수 있다. 하지만 여기서 size옵션에 portrait나 landscape를 주면 레이아웃을 세로 혹은 가로로 고정시킨채로 출력 Prompt를 불러올 수 있다. 레이아웃 뿐만 아니라 페이지의 크기(inch단위), 출력할 용지의 크기(B4, A4 등..) 도 적용하여 출력할 수 있으니 관심있으신 분들은 아래 공식 Document를 참고하길 바란다. https://stackoverflow.com/questions/72853..

프론트 연구 노트 2022. 7. 23. 12:48

넉넉한 개발자 블로그의 효자 아이템! https://bydawn25.tistory.com/31 [Javascript/React] Parse XML to JSON / XML을 JSON으로 만들기 지금하고 있는 프로젝트에서 XML을 읽어서 해석해야하는 부분이 존재했다. 개발자 인생 XML은 정말 마주하고 싶지 않은 데이터 형식인데 애석하게도 예전 표준을 따르는 많은 디바이스들이 XML을 bydawn25.tistory.com 물론 ㅋㅋㅋㅋㅋㅋㅋ 그래봐야 전체 조회수가 500회 밖에 되지 않지만 덕분에 평균조회수가 15회를 웃돌고 있다. 다음 목표는 평균 조회수 30회!(소박) 확실히 글을 꾸준히 쓰니까 방문해 주시는 분들이 계속 계신다. 앞으로도 웹과 클라우드, 나아가 내가 관심있는 여러분야의 도전기를 꾸준히..

프론트 연구 노트 2022. 6. 30. 09:30