Skip to main content

PPBL Front End: Next Steps

Updated 2023-03-10

Important Stuff​

Must be complete before course launch on Monday

  • Add license message to homepage, and add license to all repositories
  • Add https://ppbl.gimbalabs.io domain to project.
  • Update homepage of gimbalabs.com with new PPBL links, remove book club, etc
  • Define URL standard for additional language deployments. Is http://language.ppbl.gimbalabs.io ok?

Neat Stuff​

  • Consider Duplicate Token Names: We now have a simple list that students can check against on Lesson 100.4. But should we also use some front-end validation to not allow duplicate token names? We don't have to implement this: if we don't there are some nice opportunities for applied project-based learning! For example: see how 100 and 222 tokens can be matched via Minting Tx, even if duplicate Alias-names exist. Perhaps we want to investigate validation approaches that do not rely too much on Front End validation? Or maybe we make more complete use of AppWallet and only sign a Tx if conditions are met. All of these are possible lesson topics!
  • When the connected wallet holds a contributor token, show the token name or alias across the site. For example, we can at least show token name on lesson 100.4. We might also display the token name in the nav bar or footer. What ideas does everyone have?
  • Add responsive layouts to all site components. The optimal experience is to review this course on a computer, but maybe people will want to browse content on a mobile device. Let's be ready for it.
  • Refactor LessonLayout.tsx and VideoComponent.tsx so that we are using lesson data from slts.json to pull the video ID into each lesson component.
  • Eventually, we may end up with multiple videos in each lesson component. Look at videos are handled here: https://www.gimbalabs.com/pbl/plutus/2021-09. With source code here. We can change the video ids in slts.json to a list of strings. Room to experiment!

Tough Stuff​

  • MDXLessonLayout.tsx - clipboard and syntax highlighting have some bugs - for now commented out:
./src/components/lms/Lesson/MDXLessonLayout.tsx
27:35 Error: React Hook "useClipboard" is called in function "code" that is neither a React function component nor a custom React Hook function. React component names must start with an uppercase letter. React Hook names must start with the word "use". react-hooks/rules-of-hooks
45:11 Error: Do not pass children as props. Instead, nest children between the opening and closing tags. react/no-children-prop
55:11 Error: Do not pass children as props. Instead, nest children between the opening and closing tags. react/no-children-prop