> 웹 프론트엔드 > JS 튜토리얼 > 오래된 프로젝트 부활

오래된 프로젝트 부활

Linda Hamilton
풀어 주다: 2025-01-22 06:30:16
원래의
109명이 탐색했습니다.

이번 주에는 스타차트 유지 관리 작업을 했습니다. 프로젝트가 한동안 진행되지 않아 종속성을 업데이트하려고 합니다.

GitHub logo 개발공간 / 스타샤트

사용자 정의 도메인 및 인증서를 관리하기 위한 셀프 서비스 도구

스타차트 License: MIT

Starchart를 사용하면 Seneca 개발자 커뮤니티에서 비용이나 개인 정보 제공 없이 쉽게 사용자 정의 하위 도메인과 SSL 인증서를 만들고 관리할 수 있습니다.

Starchart 실행에 대한 자세한 내용은 배포 가이드를 참조하세요. 개발 정보는 기여 가이드를 참조하세요. 추가적인 기술적 배경, 계획, 초기 설계에 대해서는 위키를 참조하세요.

소개

인터넷은 진화하고 있으며, 예전에는 어려웠던 것이 단순해졌습니다. 예를 들어, 서버 관리, 운영 체제, 네트워킹 등에 대한 지식이 필요했던 자신의 웹 사이트를 호스팅합니다. 오늘날 많은 개발자는 GitHub 페이지와 같은 (무료) 클라우드 서비스를 선택하여 원격 서버를 건드리지 않고 개인 및 프로젝트 웹 사이트를 호스팅합니다. Vercel, Netlify 또는 AWS.

인터넷 보안 모델도 진화하고 있습니다. 예를 들어, 브라우저 공급업체는 모든 곳에서 HTTPS를 채택했습니다. 이는 클라이언트와 서버 간에 인증서 기반 암호화를 가능하게 하므로 보안에 좋습니다. 하지만 마찬가지로…

GitHub에서 보기

계획은 CI 워크플로를 수정하는 것이었지만 지난주에 문제가 발생한 것으로 확인되었습니다.

Image description

그러나 수정 사항을 찾기 전에 이전 개발자 중 한 명인 Eakam이 문제를 해결했습니다. 알고 보니 Playwright가 오래되었기 때문이었습니다.

오래된 프로젝트 부활 극작가를 1.49.1로 향상 #772

오래된 프로젝트 부활
Eakam1007 게시일:

CI(E2E 테스트)에서 극작가 설치가 실패합니다. 범핑 극작가 버전은 이 문제를 해결해야 합니다.

참조: Installation error log

GitHub에서 보기

더 많은 작업을 찾아서 보완해야 한다고 느꼈고 더 많은 종속성을 업데이트하는 것이 좋은 출발점이 될 것이라고 생각했습니다.

2년 동안 프로젝트를 진행하지 않았기 때문에 오래된 패키지로 인한 보안 취약점이 많았습니다. npm audit fix로 대부분을 고칠 수 있었습니다.

@remix-run/eslint-config 및 @remix-run/react에 주요 변경 사항을 초래하는 몇 가지 수정 사항이 더 있었기 때문에 수동으로 적용했습니다.

업데이트 중 하나(동시에 부딪혔기 때문에 확실하게 말할 수는 없지만 내 생각은 /react에 있음)에서 [@remix-run/react].useNavigation(으로 인해 유형 확인 오류가 발생했습니다. ).formData는 이제 정의되지 않은 유형일 수 있습니다. 옵셔널 체이닝으로 해결했습니다.

// Before
const isLoading =
  navigation.state === 'submitting' &&
  Number(navigation.formData.get('id')) === dnsRecord.id;

// After
const isLoading =
  navigation.state === 'submitting' &&
  Number(navigation.formData?.get('id')) === dnsRecord.id;
로그인 후 복사
로그인 후 복사
로그인 후 복사

제가 수행한 다른 변경 사항은 발생한 몇 가지 Lint 오류와 관련이 있었습니다(이 시점에서 ESLint 확장 기능이 꺼져 있다는 것을 깨달았지만 CI에서는 그런 일이 발생하지 않았기 때문에 이러한 경고가 업데이트와 함께 제공되었다고 확신합니다). 과거).

  1. 한 파일에서 동일한 모듈을 여러 번 가져오는 경우:
// Before
import { getCertificateByUsername } from '~/models/certificate.server';
import { deleteCertificateById } from '~/models/certificate.server';
import { isAdmin } from '~/models/user.server';
import { getUserByUsername } from '~/models/user.server';

// After
import { getCertificateByUsername, deleteCertificateById } from '~/models/certificate.server';
import { isAdmin, getUserByUsername } from '~/models/user.server';
로그인 후 복사
  1. const가 선호되는 경우 let 사용:
// Before
let date = val.toLocaleDateString('en-US', {

// After
const date = val.toLocaleDateString('en-US', {
로그인 후 복사

이전에 감지하지 못했다는 사실에 놀랐습니다.

그리고 ESLint 확장 기능을 켰을 때 약 900개의 린터 오류가 있어서 조금 놀랐습니다. ESLint가 Playwright가 생성한 출력을 Linting했기 때문에 발생한 것으로 밝혀졌습니다. 그래서 .eslintignore에 /playwright-report를 추가했습니다.

이것이 이번 스프린트에 대한 유지 관리 작업의 합계였습니다. 30개의 심각한 보안 문제를 해결했으니 나쁘지 않습니다.

오래된 프로젝트 부활 종속성 업데이트 #775

오래된 프로젝트 부활
우데이-라나 게시일:

많은 보안 취약점을 수정해야 합니다.

변경사항

  • [x] 범프 종속성
  • [x] .eslintignore에 /playwright-report 추가
  • [x] 유형 검사 및 린터 오류 수정
GitHub에서 보기

또한 몇 가지 마이너 버전을 테스트한 dependencyabot을 다시 활성화했습니다. 보안 취약점을 수동으로 조사하고 패치할 필요가 없다는 점은 좋을 것 같습니다.

다른 소식으로, Mattermost에 대한 내 끌어오기 요청 중 하나가 마침내 병합되었습니다!

오래된 프로젝트 부활 [GH-29548] `tokens_store.go`에서 SELECT *를 피하세요. #29558

오래된 프로젝트 부활
우데이-라나 게시일:

요약

이번 홍보:

  • SQLBuilder를 사용하도록 token_store.go의 SQL 쿼리를 전환합니다
  • TokenStore에 대한 SELECT 쿼리의 열을 명시적으로 정의합니다.
  • 일반적인 쿼리를 생성자로 분류합니다.

티켓링크

수정 #29548

스크린샷

출시 노트

// Before
const isLoading =
  navigation.state === 'submitting' &&
  Number(navigation.formData.get('id')) === dnsRecord.id;

// After
const isLoading =
  navigation.state === 'submitting' &&
  Number(navigation.formData?.get('id')) === dnsRecord.id;
로그인 후 복사
로그인 후 복사
로그인 후 복사
GitHub에서 보기

얼마 전에 승인이 났는데 메인에 병합되기까지 몇 주가 걸렸습니다.

그동안 저는 다른 PR 작업을 하고 있었습니다. 몇 가지 수정을 요청해 주셨고 재검토를 기다리고 있습니다.

오래된 프로젝트 부활 [MM-53650] 웹앱에 이모티콘 렌더링 비활성화 설정 추가 #29414

오래된 프로젝트 부활
우데이-라나 게시일:

요약

이 풀 요청은 웹앱에 사용자 설정을 추가하여 이모티콘(:D)을 이모티콘(?)으로 렌더링하도록 전환합니다.

설정은 구성 요소/user_settings/display/user_settings_display.tsx로 가져온 구성 요소/user_settings/display/render_emoticons_as_emoji/에 구성 요소로 추가됩니다.

새 구성 요소를 렌더링하는 데 도움이 되도록 Components/user_settings/advanced/user_settings_advanced.tsx에서 리프트된 user_settings_display.tsx에 renderOnOffLabel() 함수를 추가했습니다.

설정은 savePreferences() 액션을 사용하여 사용자 기본 설정으로 저장됩니다.

utils/constants.tsx 및 webapp/channels/src/packages/mattermost-redux/src/constants/preferences.ts에 기본 설정에 대한 상수를 추가했습니다.

실제로 설정을 사용하기 위해 구성요소/post_markdown을 수정하여 해당 값을 prop으로 수신했으며, 이에 대해 getBool()을 사용하고 구성에 기본값을 추가했습니다. post_markdown은 이 값을 옵션 개체의 Markdown에 전달한 다음 utils/text_formatting.tsx에 전달하고, 마지막으로 값을 새로 추가된 매개 변수로 emoticons.tsx에 전달합니다. emoticons.tsx는 값이 true인지 확인하고, true이면 이모티콘을 이모티콘으로 변환합니다.

영향을 받는 테스트를 업데이트하고 새 구성요소에 대한 단위 테스트를 만들었습니다. 영문번역 파일도 업데이트했습니다.

QA 테스트 단계
  1. 사용자 설정으로 이동하세요.
  2. 디스플레이 카테고리로 이동하세요.
  3. '이모티콘을 이모티콘으로 자동 렌더링' 섹션을 찾아 '수정'을 클릭하세요.
  4. 설정을 전환하고 "저장"을 클릭하세요.
  5. 현재 사용자와 다른 사용자가 보낸 메시지의 이모티콘 렌더링은 해당 설정으로 클라이언트측에서 전환되어야 합니다.

티켓링크

수정 사항(일부) https://github.com/mattermost/mattermost/issues/26504 Jira https://mattermost.atlassian.net/browse/MM-53650

참고 문제와 티켓에는 이 기능을 모바일 앱에도 추가하는 방법이 설명되어 있지만 이 PR에서는 설명하지 않습니다.

스크린샷

before after
오래된 프로젝트 부활 오래된 프로젝트 부활

출시 노트

// Before
const isLoading =
  navigation.state === 'submitting' &&
  Number(navigation.formData.get('id')) === dnsRecord.id;

// After
const isLoading =
  navigation.state === 'submitting' &&
  Number(navigation.formData?.get('id')) === dnsRecord.id;
로그인 후 복사
로그인 후 복사
로그인 후 복사
GitHub에서 보기

이 PR 작업은 흥미로웠습니다. 처음 제출했을 때 변경 사항을 완전히 이해하지도 못했기 때문입니다. 오랜만에 다시 방문하고 리뷰의 피드백을 통해 새로운 관점에서 보고 더 잘 이해하는 데 도움이 되었습니다.

Mattermost 앱은 "기본 설정"과 "구성" 모두에서 사용자 설정 상태를 가져옵니다. 참조하도록 권고받은 기존 설정 중 하나를 모방하여 두 설정 모두에 설정을 추가했지만 "구성"은 서버 수준 설정용인 반면 이 새 설정은 클라이언트측 옵션으로 의도된 것으로 나타났습니다. 리뷰는 제가 어디에서 잘못되었는지 이해하는 데 도움이 되었고, 실제로는 제가 필요하다고 생각했던 것보다 작은 변화로 끝났습니다.

전반적으로 꽤 생산적인 한 주였습니다.

위 내용은 오래된 프로젝트 부활의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

원천:dev.to
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
저자별 최신 기사
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿