microsoft / microsoft/TypeScript-Website

[Proposal] Improve TypeScript tsconfig reference web page usability

Aperta
#3,377 1 commento 3 reazioni 0 assegnatari Vedi su GitHub

Nessuno ha ancora preso questa issue.

Lingua principale
TypeScript
Stelle
2.6k
Fork
1.5k
Merge medio
2g 2h
PR unite (30g)
7

Descrizione

Summary

When visiting the original TypeScript tsconfig reference documentation web page, the first impression right away is that the page is Brobdingnagian, overweight and overwhelming. It has all the vast amount of configuration information crammed into a single, huge page that's hard to scroll and hard to survey.

From my personal point of view, it's too hard to find pertinent information therein in a timely manner. This is particularly true for daily work, where configuring TSC is not supposed to become a full-time task.

I propose to add search and filter options to the page as well as a new page layout, supposed to resemble the powerful, simple and easy to grasp File Explorer design.

Proposal

Using the original tsconfig reference documentation web page, I created a simple mock tsconfig reference page, visualizing my proposal:

        Improve tsconfig web page

Proposal Overview

The changes are simple and easy to implement:

  1. Re-arranging configuration property hyperlinks and content into two flex columns, restricting their max height to match the browser window height

  2. Adding a search bar to the top of the left flex block, along with the corresponding JavaScript

  3. When activating any of the configuration property hyperlinks, show filtered content in the right flex block by hiding all sections not addressed by the hyperlink

  4. Add an informative tooltip to each of the configuration property hyperlinks

You find the corresponding GitHub repository containing my mock implementation here:

https://github.com/SetTrend/tsConfig-config-proposal

Guida per i contributori

Nessuna guida per i contributori indicizzata per questo repository

Come iniziare

  1. Leggi tutta la issue e poi la guida ai contributi del progetto.
  2. Commenta sulla issue per dire che te ne occupi tu — evita che due persone facciano lo stesso lavoro.
  3. Fai un fork del repository e lavora su un branch.
  4. Apri una pull request che faccia riferimento al numero della issue.

Direzione di ricerca

Inizia confrontando la pagina di riferimento originale di TypeScript per tsconfig con la pagina di riferimento mock di tsconfig collegata e la panoramica della relativa proposta. Il lavoro è completato quando la pagina presenta il layout proposto a due colonne, la ricerca, sezioni di configurazione filtrate e tooltip, e l’implementazione è integrata in TypeScript-Website.

Scritto dal modello di indicizzazione a partire dal testo della issue.

Valutazione

Stack tecnologico
javascript, typescript
Ambito
documentation, frontend
Tipo di issue
Funzionalità
Difficoltà
5/5
Tempo stimato
Più di una settimana
Stato di attività
Ferma
Chiarezza
Abbastanza chiara
Idoneità per principianti
35/100

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.