uriklar / professor Goto Github PK
View Code? Open in Web Editor NEWCommunity driven professor game. Inspired by: https://professor.amiacyb.org/
Community driven professor game. Inspired by: https://professor.amiacyb.org/
Add option for boards to have tags (some boards may have a specific topic: Sport, Emoji, numbers etc...)
When selecting the 4th word, the selection get cleared really quickly. We need to add a small timeout so the user sees they selected the 4th word
Should clear that specific board from local storage
In Square.tsx you have the Container component which has tabIndex: 0;
This makes squares accessible by tabbing. But, once the itemState is either AnswerState.Matched or AnswerState.Answered
there's no reason for them to be tab-able since the user can't interact with them.
You can make Container
s attrs
dynamic by having it accept props. Something like:
.attrs( props => ({ role: "button", tabIndex: props.isTabbable ? 0 : 1}))
Now, when a category is found or answered, pressing tab should skip it.
Open questions:
Do we need a downvote button?
Should like appear from the start? Or maybe after solving some part of the board?
Content:
we should have an /edit/ID path that fetched the board and renders it in the create form.
This requires to extract create.tsx into a component. We can pass it an onSubmit prop that either creates a board or updates a board
Sort (asc/desc) by how many categories where matched/answered.
Sort example:
3 answered > 2 answered + 1 matched
3 matched > 2 answered
Basic design
Add ability to enter answer for a category
Create board form
Persist progression data in local storage
Screen for creating a board (will be detailed in a separate issue)
Fetch board from DB by id in url
Create DB and integrate with it (firebase?)
Open graph tags and other meta tags
Favicon
Deploy somewhere (probably vercel)
Handle long words
Add husky and lint-prepush (to execute TS/Eslint/Prettier checks before push)
Contribution guide - what you need to setup to get going
Create a script to seed a test database
User login - Show all boards by user, show all boards solved by user, show profile info on the user's boards
Write copy for rules of creating a category
Tests - jest unit tests for game logic, Maybe some Cypress tests if someone feels like it (I can guide you how to integrate it with Github actions)
This the way board ids are currently generated:
username (which the user enters) + random 4 digit number
This was a very bad design choice ๐คฆโโ๏ธ as what can happen now is that the a user can randomly get the same 4 digit number and accidentally overwrite a previous board of his without knowing.
What I think we should do:
In the [id].tsx and index.tsx getServerSideProps we already have a query that fetches all board ids.
I added mock ids to the create page so you don't have to connect to firebase to work on this feature. So you can run npm test to see if it passes.
You can also add your own tests if you need..
It's on this branch:
https://github.com/uriklar/professor/compare/issue-15-fix-ids
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.