#storybook

자기주도적인 개발이 너무 어렵습니다.

안녕하세요.🙇‍♂️ 올해 3월에 부트캠프를 수료하고 취업준비를 하고있는 프론트엔드 지망생입니다. 부트캠프를 통해 js, react, vue, tailwind, zustand등의 스택을 주로 사용하며 프로젝트를 만들었습니다. 부트캠프를 진행하면서 react에서 useEffect훅은 컴포넌트의 생명주기 사이 ~때에 사용한다, 페이지 라우팅 기능을 사용하려면 리액트 라우터 같은 라이브러리를 활용해서 써야한다, 테일윈드가 현재 개발시장에서 가장 많이 쓰이는 CSS 라이브러리다 이런 정도로 기술스택들이 학습되었습니다. 이제 부트캠프도 수료하고 혼자 공부하는 시간이 찾아왔는데 어떤것 부터 어느정도 까지 손을 대야할지 감이 잡히질 않습니다. 1. 어떤것 부터 해야하는지 예를 들어 현재 저에게 가장 부족하다고 생각하는 스택은 next 프레임워크, zustand 외의 전역 상태관리(recoil, redux), 필수 개발 외의 인프라적인 스택?(Storybook, monorepo, sentry, jest )이라고 생각하는데 이 지식들의 우선순위를 정하는 방법과 이 외에도 개발자 시장에서 반드시 장착하고 있어야 하는 필수 스택에 무엇이 있는지를 알고싶습니다. 2. 어느정도 까지 손을 대야할지 예를 들어 React 같은 경우엔 하나의 프로젝트를 만드는 역량까진 가능해졌지만 프로젝트 안에서 퀄리티 있는 디자인 패턴이라던지, 사용해보지 못한 수많은 리액트 메서드들을 딥다이브 해봐야 할 거 같은데, 어느정도 까지 공부해야 너무 깊게 들어가지 않고, 현재 개발시장에서 경쟁력 있는 지식을 쌓았다고 할 수 있는지의 경계를 모르겠습니다. 강사님의 강의에서 벗어나 혼자서 주도적인 학습을 진행하려고 하니 시간낭비를 하게 될 거 같고, 겉햝기 식으로 공부하는 나날을 보내게 될까 심적으로 큰 부담이 됩니다.. 현업 개발자님들의 조언을 듣고싶습니다!!🙇‍♂️🙇‍♂️🙇‍♂️

ESLINT 어떤 것을 수정해야 내용처럼 fix 되는 현상을 막을 수 있을까요?

안녕하세요~ eslint, prettier에서 제가 무엇을 잘못했는지 계속 아래처럼 코드가 수정되고 있습니다. const res = (await request) < User > (context, `/users/${id}`); 어떻게 하면 고칠 수 있을까요? 1. (await request) 소괄호 제거 2. < User > 제너릭 사이 공백 제거 결론: const res = await request<User>(context, `/users/${id}`) 로 만들고 싶습니다.. 아래는 eslint 적용한 내용 입니다. ``` //eslint.config.js module.exports = { env: { browser: true, es2021: true, }, extends: [ 'plugin:react/recommended', 'airbnb', 'plugin:storybook/recommended', ], parser: '@typescript-eslint/parser', parserOptions: { project: ['./tsconfig.json'], ecmaVersion: 2018, sourceType: 'module', createDefaultProgram: true, }, plugins: ['react', '@typescript-eslint', 'prettier', 'import'], rules: { 'react/react-in-jsx-scope': 'off', 'react/jsx-props-no-spreading': 'off', 'import/prefer-default-export': 'off', 'implicit-arrow-linebreak': 'off', 'react/jsx-filename-extension': [ 2, { extensions: ['.js', '.jsx', '.ts', '.tsx'], }, ], 'object-curly-newline': [ 'error', { ObjectPattern: { multiline: true, minProperties: 2, }, ImportDeclaration: 'never', ExportDeclaration: { multiline: true, minProperties: 3, }, }, ], 'import/extensions': [ 'error', 'ignorePackages', { js: 'never', mjs: 'never', jsx: 'never', ts: 'never', tsx: 'never', }, ], 'import/order': [ 'error', { alphabetize: { order: 'asc', }, groups: [ 'builtin', 'external', 'internal', 'parent', 'sibling', 'index', 'object', 'type', ], }, ], 'import/no-unresolved': 'off', }, settings: { 'import/resolver': { typescript: { alwaysTryTypes: true, }, node: { paths: ['src'], }, }, }, }; ```

선배님들께 입사 한 달 차 프론트 커리어 고민상담 받고싶습니다.

안녕하세요. 저는 입사 이제 한 달 차가 되어가는 신입 프론트엔드 개발자 입니다. 저는 개발을 좋아하고 관심이 많아서 작년 12월부터 프론트 공부를 시작하게 됐습니다. 그리고 운이 좋게 6월에 취업을 하게 되었습니다. 프론트엔드 개발을 하면서 js, ts, next.js, react-query, redux, zustand등 배워야할 게 정말 많았습니다. 그래서 프로젝트를 하면서 얕게나봐 최신 기술을 많이 공부해봤습니다. 하지만 제가 취업한 회사에서는 하드웨어 기술적 제약때문에 최신 기술을 사용하지 못하고 사용적인 제한이 굉장히 많아서 커리어적으로 성장을 할 수 있을지 고민이 많이 됩니다. 물론 아직 부족하기 때문에 배울 것이 많다는 것을 알지만 요즘 it회사들을 보면 회사 기술 사용 스택을 보면 ts, react-query, next.js, storybook 등 트랜디한 기술을 많이 사용하는 것 같습니다. 경력 없는 신입 취업도 요즘 힘들고 해서 경력을 쌓고 이직을 해야하나 생각을 하고 있는데 최소 1년을 경력을 쌓으려고 생각을 하고 있습니다. 제가 목표로 하는 회사의 기술 스택을 봤는데 ts, react-query, next.js, zustand, emotion 등을 쓰고 있더라고요. 하지만 개발을 하다보면 js공부가 핵심이고 많이 부족하구나를 많이 느낍니다.. 신입 이직을 할 때 중요한 점이 무엇인지 궁금합니다. 3년차 미만이면 코딩테스트를 준비해야할 수도 있다고 하는데 알고리즘 공부를 꾸준히 하는 것이 중요할까요?? 그리고 저런 기술들을 사용한 사이드 프로젝트를 얼마나 해야할까요?? 혹자는 하나만 프로젝트 제대로 해도 면접에서 말하기 부족하다고 하는데, 요즘 취업 준비생들의 스펙을 보면 프로젝트도 많이하고 하는 것 같아서 궁금합니다.. 그리고 선배님들 성장 비결은 무엇인지 무엇으로 공부를 많이 하는지도 궁금합니다. 요즘 저는 깃허브에서 완성된 프로젝트 코드를 보면서 공부를 좀 해보고 있는데 괜찮을까요?? 적다보니 두서없이 적었는데 읽어주셔서 감사합니다. 커리어적 조언과 신입 이직을 위해서 무엇을 준비해야하는지 어떻게 하면 이런 상황에서 성장을 할 수 있는지 궁금합니다..!! 욕심은 많은데 부족함을 많이 느껴서 이렇게 글 적어봅니다..

react 오픈소스 UI 라이브러리 쓰시나요?

이번에 사이드 프로젝트에 새로 합류하게 되었는데, 전임 프론트 개발자 분이 Ant Design을 적용해놓고 가셨더라고요. 프로젝트 코드도 다 Ant Design 컴포넌트들로 적용이 된 상태입니다. 저는 사실 회사에서 이런 UI 라이브러리를 써본적은 없고 bootstrap 이나 tailwindcss로 구현된 내부 컴포넌트들 밖에 안 써봤는데요. 혹시 실제 사용하는 서비스에서도 Ant Design 같은 UI 라이브러리를 사용하는지 궁금합니다! 추가로 최근 Storybook을 잠깐 봤는데, 이거는 UI 라이브러리인가요?