README

This app lets you keep score of all your board games (or any games), and look back at any session of a game to see who won that time!

For the backend:

• I use Ruby on Rails as the server, with a PostgreSQL database in production.
• I use the jsbundling-rails gem to bundle JS files (as my frontend is React-based).
• I use Devise to handle authentication/sessions.
• I use the sassc-rails gem to pre-process my stylesheets.
• I use bullet and letter_opener in development for optimizing and testing the mailer, respectively.
• All backend routes are namespaced under 'api' to avoid conflicts with frontend routes
• I use rspec for testing.

For the frontend:

• I use React for my frontend, calling my /api routes to get JSON data from my backend.
• For testing, I use Jest as well as the React testing library.
• I use react-router to handle all the public-facing routes.

This app is deployed at https://tabletoptally.fly.dev/.

On the home page, you can see all games that any user has added to the database, along with details:

To view the games you've added, go to the My Games page. There, you can also search for a specific game:

You can also create a new game here. For the Image URL, I'd suggest copying the direct image URL (it should end in an image file extension, like .jpg) from a place like Boardgamegeek.com:

You can see your user information in the Profile page:

When you click on a game, you can see the game details, the leaderboard for that game, and all previous sessions for that game (sorted by most recent):

Clicking "New Session" will create a session for you. You can click into that session to edit the date, view details, and add players to that session:

Once you're done with a game, add the scores!

If the game has categories that aren't score-based but just win-based, you can check boxes for those categories too:

tally

Docs that were helpful in the making of this project:

• RSpec "before" documentation: https://www.rubydoc.info/gems/rspec-core/RSpec%2FCore%2FHooks:before
• Setting default RSpec formatting: https://stackoverflow.com/questions/40023188/can-i-set-rspec-format-documentation-as-the-default
• RSpec Rails documentation: https://github.com/rspec/rspec-rails
• ActiveRecord callbacks: https://guides.rubyonrails.org/active_record_callbacks.html#creating-an-object
• Default sort order for associations: https://stackoverflow.com/questions/36221631/set-default-order-of-a-has-many-resource-at-the-active-record-level
• Handle non-click events in React: https://legacy.reactjs.org/docs/handling-events.html
• Using SASS in Rails: https://stackoverflow.com/questions/73417883/loaderror-cannot-load-such-file-sassc
• HTML Events: https://www.w3schools.com/jsref/dom_obj_event.asp
• CSS Media queries: https://stackoverflow.com/questions/66045259/css-grid-two-columns-on-desktop-and-1-column-on-mobile
• Rails Nested Forms: https://www.ombulabs.com/blog/learning/rails/nested-forms.html
• Git branching: https://www.w3schools.com/git/git_branch_merge.asp?remote=github
• Rails Mailers: https://akladyous.medium.com/ruby-on-rails-action-mailer-configuration-6d0cfc00b871

Jest Testing Help:

• Jest and React Hooks: https://vaskort.medium.com/how-to-unit-test-your-custom-react-hook-with-react-testing-library-and-jest-8bdefafdc8a2
• Testing React Apps: https://jestjs.io/docs/tutorial-react
• React Testing Library: https://testing-library.com/docs/
• React Testing Library guide: https://testing-library.com/docs/react-testing-library/intro
• DOM Manipulation: https://jestjs.io/docs/tutorial-jquery
• Jest Docs: https://jestjs.io/docs/api
• Testing UseState: https://allmaddesigns.com/test-react-usestate-with-jest/
• Mocking hooks in components: https://dev.to/mbarzeev/mocking-data-fetching-react-hooks-nn5
• Accessible Roles: https://www.w3.org/TR/html-aria/#docconformance
• ByRole docs: https://testing-library.com/docs/queries/byrole
• UserEvent: https://testing-library.com/docs/user-event/v13/#typeelement-text-options
• Jest Setup: https://jestjs.io/docs/setup-teardown
• Info on act(..) in React testing: https://github.com/threepointone/react-act-examples/blob/master/sync.md
• Running Console tasks: https://fly.io/docs/rails/the-basics/run-tasks-and-consoles/ (Use "fly console" to get into console for prod app!)
• 'Joins' documentation: https://guides.rubyonrails.org/active_record_querying.html#joining-tables
• Associations: https://guides.rubyonrails.org/association_basics.html
• Active Record Queries: https://guides.rubyonrails.org/active_record_querying.html#joins

Styling:

• If I ever want to do toggles instead of checkboxes: https://www.w3schools.com/howto/howto_css_switch.asp
• Centering blocks: https://css-tricks.com/quick-css-trick-how-to-center-an-object-exactly-in-the-center/

Git:

• deleting remote branches: https://www.freecodecamp.org/news/git-delete-branch-how-to-remove-a-local-or-remote-branch/