29cm-frontend-snippet-pack README

29CM 프론트엔드팀의 생산성 향상을 위해 Snippet 팩을 제공합니다.

Usage

Color

color

color: ${({ theme }) => theme.color.$1}

[background-color]

background-color: ${({ theme }) => theme.color.$1}

[themeColor]

${({ theme }) => theme.color.$1}

React

[rfe]

import styled from '@emotion/styled';

interface Props {
  className?: string;
}

export const $1 = ({ className }: Props) => {
  return <Container className={className}>$1</Container>;
};

const Container = styled.div``;

Storybook

[story]

import { Meta, Story } from '@storybook/react'
import { ComponentProps } from 'react';
import { $1 } from './$1';

type Props = ComponentProps<typeof $1>;

const Template: Story<Props> = () => <$1 />;

export const Default = Template.bind({});

export default {
  title: '',
  component: $1,
} as Meta;

Utils

[lc]

${RELATIVE_FILEPATH}