refactoring4 [React] Refactoring 안녕하세요 :) 이 주간 정신없이 데모를 위한 웹어플을 만들고 나니 벌써 5월이 되었네요 ㅎㅎ 오늘은 너저분하게 흐트러져 있는 코드를 리펙토링 하는 시간을 가져보았습니다. 사실 사수로부터 체계적으로 배운 코딩이 아니라 리펙토링이 다소 엉성할 수 있습니다. 그냥 이렇게 하는 사람도 있구나하는 가벼운 느낌으로 참고해 주시면 감사하겠습니다. 리펙토링 코드: import styled from "styled-components"; import Button from "ui/button/Button"; import { RepeatClockIcon } from '@chakra-ui/icons'; import { useAppDispatch, useAppSelector } from "store/hooks"; import .. 2023. 5. 3. [React] Single Responsibility Principle 리펙토링 하기 안녕하세요, 개발자 Sean입니다. 저번 포스팅에서 SOLID 원칙에 대한 공부를 해봤으니 본격적으로 코드 리펙토링에 들어가려고 합니다. 우선은 오늘 제가 수정할 코드는 아래와 같습니다. const Analytics = () => { //States const [isLoading, setIsLoading] = useState(false); //Hooks const dispatch = useDispatch(); const analytics = useSelector((state) => state.analytics); const user = useSelector((state) => state.user); useEffect(() => { getTabList(); }, []) //Methods const getT.. 2022. 11. 1. [React] 리엑트에 SOLID 원칙 적용시키기 안녕하세요, 개발자 Sean입니다. 오늘은 베타 버전을 끝마치고 이제는 뭘 해야 할까... 뒹굴대다가 본격적으로 리펙토링을 가지는 시간을 좀 가져볼까 합니다. 그래서 리펙토링을 어떤 원칙을 가지고 접근하면 좋을까 고민하다 아래와 같은 좋은 글이 있어 옮겨봅니다. Applying SOLID principles in React 소프트웨어 산업이 성장하며 개발자들이 수많은 우여곡절을 겪음에 따라 모범사례와 우수한 소프트웨어 설계 원칙이 나타나고 미래에 똑같은 실수를 방지하기 위해 개념화되었습니다. 특히 객체 지향 프로그래밍의 세계에서 이러한 모범사례가 수많이 개발되었고 SOLID는 의심의 여지없이 더욱 영향력을 키우게 되었습니다. SOLID는 각각의 글자가 다섯개의 설계 원칙을 의미하는 축약어 입니다: Sin.. 2022. 10. 31. 코드 리팩터링하기 안녕하세요, 개발자 Sean입니다. 소프트웨어 엔지니어링은 다른 공학과는 다르게 무형의 어떤 것을 만들어낸다는 특징이 있습니다. 그렇기 때문에 어플을 만들어 나가는 과정에서 무수히 많은 예상치 못한 결과를 만나기도 합니다. 또한 잘 계획되지 못한 기능 구현은 끔찍한 코드 실타래를 만들어 내고 이는 필연적으로 원인을 알 수 없는 버그와 에러로 이어지죠. 그리고 이번 주에 제가 그런 실수를 범했습니다. 애널리틱스라는 분석 페이지를 제작 중이었는데요, 음... 복잡한 기능인 데다가 개념 이해가 어렵다 보니 일단은 만들고 보자 라는 생각으로 무작정 키보드부터 두드리고 본 결과 약 1천줄의 ... '의미를 알 수 없는 변수명'과 '왜 이렇게 짜인 건지 이해할 수 없는 컴포넌트 구조'로 점철된 코드가 만들어졌습니다.. 2022. 10. 13. 이전 1 다음
