유어슈 슬랙 아카이브

5월 12일, 오후 5:33 에 아카이브됨

Feca [Web FE] 5월 11일, 오전 11:06

안도나요?

5월 11일, 오전 11:06 에 아카이브됨

Feca [Web FE] 4월 4일, 오전 8:04

안녕하세요, 프론트엔드팀 페카라고해요.

유어슈 슬랙 특성상 90일이 지난 메시지나 스레드는 열람할 수 없는 문제가 있어요.
생각보다 90일이 빨리 지나기도 하고, 어떤 대화를 했는지 볼 수 없어서 아쉽더라고요.

그래서 슬랙에서 명령어 한 번 딸깍으로 스레드를 아카이빙해서
웹사이트에서 두고두고 볼 수 있도록 아카이브 웹을 만들었어요. (영구 저장)

https://archive.yourssu.com/

• 우선 멘션봇을 채널에 추가해주세요.
• 원하는 스레드에서 !아카이브, !조용히아카이브 명령어로 아카이브할 수 있어요.
자세한 사용 방법 및 FAQ는 유어슈 노션 슬랙 아카이브 페이지 에서 확인해주세요!
기능 추가 건의는 언제나 환영입니다!

archive.yourssu.com

유어슈 슬랙 아카이브

어떤 일이 있었을까요?

51개의 댓글

Feca [Web FE] 3월 29일, 오전 5:42

mp4 테스트

35개의 댓글

Feca [Web FE] 4월 7일, 오후 2:09

에러테스트

13개의 댓글

Ren [HR Vice Lead/PM] 4월 12일, 오전 12:22

테스트

Feca [Web FE] 4월 5일, 오후 12:07

깃허브 attachment 테스트

7개의 댓글

Feca [Web FE] 3월 29일, 오전 10:16

100에 육박하는 거대 mov 테스트

Feca [Web FE] 4월 4일, 오후 2:21

링크 프리뷰 테스트

34개의 댓글

Feca [Web FE] 3월 29일, 오전 10:46

개발 남은거 스레드

15개의 댓글

https://youtu.be/6RQ-bBdASvk?si=C3MXPC8w5c3l0tOP

Feca [Web FE] 4월 5일, 오전 11:09

YouTube | 딩고 뮤직 / dingo music

성시경(Sungsikyung)의 킬링보이스를 라이브로! - 너의 모든 순간, 좋을텐데, 넌 감동이었어, 희재, 두사람, 미소천사, 거리에서, 태양계, I Love Uㅣ딩고뮤직

Feca [Web FE] 3월 30일, 오전 9:38

ul 테스트

17개의 댓글

Feca [Web FE] 3월 29일, 오전 10:42

이런건 어떻게 처리?

2개 파일

11개의 댓글

Feca [Web FE] 3월 29일, 오전 3:55

a
c

Feca [Web FE] 3월 22일, 오전 5:58

아카이빙 파일 확장자 테스트용 스레드

104개의 댓글

Feca [Web FE] 4월 2일, 오전 10:40

@멘션봇관리자 (@Feca [Web FE]) (편집됨)

14개의 댓글

Feca [Web FE] 4월 1일, 오전 3:08

조용히 아카이브 테스트

22개의 댓글

Feca [Web FE] 3월 31일, 오전 6:10

인용문 테스트

12개의 댓글

Feca [Web FE] 3월 31일, 오전 9:39

멘션 테스트

Feca [Web FE] 3월 24일, 오전 8:14

드디어 구현끝냈다

Feca [Web FE] 3월 31일, 오전 7:59

인용문 테스트2 (고정)

13개의 댓글

스레드

4월 17일, 오후 10:32 에 아카이브됨

Feca [Web FE] 4월 7일, 오후 2:09

에러테스트

13개의 댓글

Feca [Web FE] 4월 7일, 오후 2:09

!아카이브갱신

14:10

!아카이브갱신

멘션봇앱 4월 7일, 오후 2:10

총 1개의 아카이빙된 스레드를 갱신해요.

14:10

아카이빙을 완료했어요. [아카이브 링크] (편집됨)

EATSTEAK [Web FE]

다들 Component Composition 어떻게 하시나요.

예) 같은 디자인, 내부 요소를 가진 컴포넌트이지만 사용처에 따라 시멘틱 의미가 달라지거나 다른 태그를 사용해야 할 때

import { ComplexButton } from "complex-button";
import { Link } from "react-router";

export function ButtonAsLink() {
  return (<>
    {/* radix style */}
    <ComplexButton asChild>
      <Link to="/link">
        Hello
      </Link>
    </ComplexButton>
    {/* `as` Style */}
    <ComplexButton as={Link} />
  </>);
}

@radix-ui/react-slot 이 참 좋아서 애용하고 있긴 한데, asChild를 쓸 경우 children까지 신경써야 하는 경우가 있어서 as prop같은 스타일도 같이 사용할까 생각 중이에요(<= 근데 라이브러리 뭐 쓸지 못찾아서 고민).

여기에 더해서 ComplexButtonGroup 같은 컴포넌트를 만든다고 할 때, query parameter를 조작할 일이 있으면(singular ButtonGroup의 selection 상태를 query parameter로 컨트롤) 당연히 Link 컴포넌트를 사용해서 시멘틱 맥락을 노출하는 것이 좋은데, 이걸 깔끔하게 할 방법이 떠오르지 않더라고요 (일반 ButtonGroup이면 onClick과 이벤트 핸들링으로 전파가 가능한데, query params를 사용하면 Item의 각 value마다 query params를 가진 url을 렌더해줘야 하니까 동작이 크게 달라짐).

이걸 일반화 하려면 어떤 식으로 사용하는 게 좋을까요?

제가 생각하는 to-be 는 아래랑 비슷한데, 이걸 구현하는 좋은 방법이나 아이디어 있으면 의견 부탁드려요.

import { ComplexButton } from "complex-button";
import { Link } from "react-router";

export function ButtonAsLink() {
  return (<>
    {/* radix style */}
    <ComplexButton asChild>
      <Link to="/link">
        Hello
      </Link>
    </ComplexButton>
    {/* `as` Style */}
    <ComplexButton as={Link} />
  </>);
}

TL;DR
1. asChild 처럼 시멘틱 태그 변경할 때 어떤 방식이 좋을까
2. 화면에 보이는 요소(스타일, 내부 태그들)은 동일한데 인터렉션 동작만 크게 다르다면 이걸 어떻게 일반화 해야 할까(예: Button <-> Link)

4월 6일, 오후 2:51

메시지 보기

14:10

갱신이 완료됐어요!

Feca [Web FE] 4월 7일, 오후 2:10

멘션봇앱 4월 7일, 오후 2:10

총 1개의 아카이빙된 스레드를 갱신해요.

14:10

아카이빙을 완료했어요. [아카이브 링크] (편집됨)

Feca [Web FE] 4월 7일, 오후 2:10

???

14:11

??????

멘션봇앱 4월 7일, 오후 2:11

갱신이 완료됐어요!

Feca [Web FE] 4월 17일, 오후 9:29

!아카이브

멘션봇앱 4월 17일, 오후 9:29

아카이빙을 완료했어요. [아카이브 링크] (편집됨)

Feca [Web FE]

에러테스트

4월 7일, 오후 2:09

메시지 보기

스레드

4월 17일, 오후 10:32 에 아카이브됨

Feca [Web FE] 4월 7일, 오후 2:09

에러테스트

13개의 댓글

Feca [Web FE] 4월 7일, 오후 2:09

!아카이브갱신

14:10

!아카이브갱신

멘션봇앱 4월 7일, 오후 2:10

총 1개의 아카이빙된 스레드를 갱신해요.

14:10

아카이빙을 완료했어요. [아카이브 링크] (편집됨)

EATSTEAK [Web FE]

다들 Component Composition 어떻게 하시나요.

예) 같은 디자인, 내부 요소를 가진 컴포넌트이지만 사용처에 따라 시멘틱 의미가 달라지거나 다른 태그를 사용해야 할 때

import { ComplexButton } from "complex-button";
import { Link } from "react-router";

export function ButtonAsLink() {
  return (<>
    {/* radix style */}
    <ComplexButton asChild>
      <Link to="/link">
        Hello
      </Link>
    </ComplexButton>
    {/* `as` Style */}
    <ComplexButton as={Link} />
  </>);
}

이걸 일반화 하려면 어떤 식으로 사용하는 게 좋을까요?

제가 생각하는 to-be 는 아래랑 비슷한데, 이걸 구현하는 좋은 방법이나 아이디어 있으면 의견 부탁드려요.

import { ComplexButton } from "complex-button";
import { Link } from "react-router";

export function ButtonAsLink() {
  return (<>
    {/* radix style */}
    <ComplexButton asChild>
      <Link to="/link">
        Hello
      </Link>
    </ComplexButton>
    {/* `as` Style */}
    <ComplexButton as={Link} />
  </>);
}

4월 6일, 오후 2:51

메시지 보기

14:10

갱신이 완료됐어요!

Feca [Web FE] 4월 7일, 오후 2:10

멘션봇앱 4월 7일, 오후 2:10

총 1개의 아카이빙된 스레드를 갱신해요.

14:10