TIL 49 | 프리온보딩 2 주차 회고록

song hyun·2022년 2월 13일
0

회고록

목록 보기
6/8
post-thumbnail

프리온보딩 2주차

취업하고십구 팀 재정비

프리온 보딩 2주차 총 4번의 프로젝트를 진행하면서 2번의 밤을 세우는 일을 종종 경험하게 되었다. 종종 밤을 세우다 보니까 삶의 질도 떨어질고, 계획했던 일정도 무너지고 협업 방식 하는 데 있어서 문제가 있다고 느껴져서 협업 방식에 대한 논의와 팀 룰을 재정비하여 효율적으로 프로젝트를 진행하는 방법에 대해 논의한 결과 아래와 같다.

  1. 프로젝트 세팅과 기능 파악을 따로 따로 하여 시간이 남는지 않도록 하기.
  2. 회의 시간에는 GitHub - Project을 사용하여 각 자 현재 진행 상황과 진행 사항이 마무리 되면 다음으로는 어떤 걸 하지 말하여, 프로젝트 진행이 어떻게 되고 있는지 흐름을 파악하기 쉽게 하였다.
  3. GitHub - issues를 적극적으로 활용하여 기능을 분배하는 데 있어서 중복 없이 분배한 다음에 이슈에 대한 상황을 공유하여 다른 팀원이 중간에 그 이슈에 투입되어도 어려움 없이 진행하도록 할 수 있게 노력했다.

실전에서 만나는 TypeScript

styled-components, typescript, react를 세 가지 기술을 사용하는 데 있어서 컴포넌트를 효율적으로 관리하기 위해서 아래와 같은 방법은 구성하여 컴포넌트를 만들었다.

  • Components.tsx
  • Components.styled.ts
  • Components.type.sts
// Sample.tsx
import React, { ReactElement } from 'react';
import { SCProps } from 'types/props';
import SampleProps from './Sample.type';
import * as S from './Sample.styled';

const Sample = ({
  className,
  children,
  sampleId,
  title,
  primary,
}: SCProps<SampleProps>): ReactElement => (
  <S.Sample className={className} primary={primary}>
    <span>{sampleId}</span>
    <span>{title}</span>
    {children}
  </S.Sample>
);

Sample.defaultProps = {
  title: 'title',
  primary: false,
};

export default Sample;
// Sample.styled.ts
import styled from 'styled-components/macro';
import SampleProps from './Sample.type';

export const Sample = styled.div<Pick<SampleProps, 'primary'>>`
  width: 100px;
  color: ${props => props.theme.color.primaryBlue};
`;

// Button.typs.ts

export default interface SampleProps {
  sampleId: number;
  title?: string;
  primary: boolean;
}
profile
Front-end Developer 🌱

0개의 댓글