Refactor codes for alumni page #94
Conversation
- Add TypeScript type checking for majority of codes - **Need Help**: make the types more granular - Separate alumniData from code logic
Implement a useBaseUrl hook on the URL at the component level, so that the site can now be deployed to another `baseUrl` without changing the (previously absolute) url of images
- Fixed a bug for image alt text to overflow - Add editorconfig for cross-platform collaboration
|
Deploy preview built successfully 🎉 Built with commit f4bc8fa |
src/components/Members.tsx
Outdated
| export type Member = { | ||
| // should implement a few custom types later | ||
| readonly name: string; | ||
| readonly image: string; | ||
| readonly website: string; | ||
| readonly github: string; | ||
| readonly linkedin: string; | ||
| readonly bio: string; | ||
| readonly favoredLink: string; | ||
| readonly bio?: string; // should be shorter than 120 characters | ||
| readonly image?: string; | ||
| readonly website?: string; | ||
| readonly github?: string; | ||
| readonly linkedin?: string; | ||
| readonly email?: string; // should begin with "mailto:" | ||
| readonly favoredLink?: "website" | "github" | "linkedin" | "email"; | ||
| }; |
There was a problem hiding this comment.
I'm thinking about making these types more granular
For example:
emailmust begin withmailto:followed by the email addressbioshould be a string no longer than 120 characterslinkedinandgithubshould begin with their domain
There was a problem hiding this comment.
I'm still going through the TypeScript Manuals for ideas
Let's hope I do find something helpful
There was a problem hiding this comment.
I'm thinking about making these types more granular
For example:
mailto:followed by the email address
bioshould be a string no longer than 120 characters
githubshould begin with their domain
This is impossible to achieve in typescript
There was a problem hiding this comment.
I'm thinking about making these types more granular
For example:
mailto:followed by the email address
bioshould be a string no longer than 120 characters
githubshould begin with their domainThis is impossible to achieve in typescript
That's sad : (
I was just reading through this issue microsoft/TypeScript#6579 and thought if there exists a workaround for now
There was a problem hiding this comment.
I'll see if i can find a solution by tomorrow.
Otherwise we'll have to leave it like this. Implementing a format check during run-time would be unnecessary (plus unwise).
There was a problem hiding this comment.
I'll see if i can find a solution by tomorrow.
Otherwise we'll have to leave it like this. Implementing a format check during run-time would be unnecessary (plus unwise).
In general that will require a dependent type system, and that's usually not what most of the programming language can provide.
There was a problem hiding this comment.
In general that will require a dependent type system, and that's usually not what most of the programming language can provide.
Thanks for pointing that out! I'm still pretty new to these PL concepts and will definitely look more into things related with type systems.
|
You can also follow the instructions in facebook/docusaurus#2687 to setup type declaration files to avoid red squiggly lines below |
Wow thanks I was just Googling for that yesterday! |
- Remove unneeded type annotations (which can be figured out with type inference, thanks for @SamChou19815 for pointing out) - Add a few comments to make the Member type clearer for new maintainers - Remove `null` entries from alumniData
Using AirBnb style with support to React JSX and TypeScript Yet ESLint still gives error "import/no-unresolved: Unable to resolve path to module '@theme/Layout'." Also, there are lots of other errors (regarding codestyle) that I will fix later with another PR
Major Changes:
Minor improvements:
baseUrlwithout changing the (previously absolute) url of images