Office snack requests, like never before!
I built this in order to learn (the basics) of how to use Solid.js
And because for work, my job is to order in office snacks, and sending out surveys is boring.
A platform for real-time requesting and voting on snacks for the office. So that the fridge is always well stocked with food people actually love.
- View current, upcoming and past snack orders
- Request snacks
- Vote (up/down) on snacks
- View stats, like most loved, hated, controversial snacks
- SSO login, with access restricted by email domain
- Admin portal, where snack inventory can be managed
DEMO_Snack-Champion.mp4
Tech Stack
Built using Solid.js [1] on the frontend (along with TS [2] and SCSS [3]), tested with Jest [4], bundled with Vite [5]. The data is stored using a Postgress [6] DB via Supabase [7], with the frontend deployed to Netlify [8] and the code hosted on GitHub [9] and CI/CD workflows managed with GH Actions[10].Standards
Future plans
I think it would be pretty fun to extend this, to automate as much of the process as possible. Based on snack ratings and user requests, use AI to generate a varied list of snacks that's within budget. Hook up to Slack to get approval from HR, use a supermarket API to make the order, generate the invoice and submit that to our companies expenses API, insert the arrival time into my calendar with Google API, and then collect employee snack feedback, and iterate for the next week.That would basically be my whole job, automated.
To deploy the app, follow the development instructions to get the code + dependencies, then run yarn build
to build the production app, and use a web server of your choice to serve up the /dist
directory.
You'll also need to deploy a Postgres DB, it's recommended to use Supabase. For setup instructions, see the Data section below.
The frontend can also be deployed to a static hosting provider of your choice. You can use the 1-click deploys below for Netlify or Vercel.
Docker image coming soon...
![schema class diagram](https://private-user-images.githubusercontent.com/1862727/286725255-866d2c52-685b-4a5d-ab96-f28b28194f3c.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MjM4NDEyNDAsIm5iZiI6MTcyMzg0MDk0MCwicGF0aCI6Ii8xODYyNzI3LzI4NjcyNTI1NS04NjZkMmM1Mi02ODViLTRhNWQtYWI5Ni1mMjhiMjgxOTRmM2MucG5nP1gtQW16LUFsZ29yaXRobT1BV1M0LUhNQUMtU0hBMjU2JlgtQW16LUNyZWRlbnRpYWw9QUtJQVZDT0RZTFNBNTNQUUs0WkElMkYyMDI0MDgxNiUyRnVzLWVhc3QtMSUyRnMzJTJGYXdzNF9yZXF1ZXN0JlgtQW16LURhdGU9MjAyNDA4MTZUMjA0MjIwWiZYLUFtei1FeHBpcmVzPTMwMCZYLUFtei1TaWduYXR1cmU9OTEyMTMzNDBlYmQ2YmYyOGYwZjMzOTYyMzFkZTczNzI3MGU1ZTg4ZGEzOWUzOWRkZTQzNTE5MzU2Y2VlNTkxMyZYLUFtei1TaWduZWRIZWFkZXJzPWhvc3QmYWN0b3JfaWQ9MCZrZXlfaWQ9MCZyZXBvX2lkPTAifQ.AI-lITodpW0GLKFn09qach5odjYZ3xWNZTPT3N9Yjpg)
create table
public."Snacks" (
snack_id uuid not null default gen_random_uuid (),
snack_name character varying not null,
user_id uuid null,
created_at timestamp with time zone not null default now(),
snack_category public.snack_category null,
snack_meta json null,
constraint Snacks2_pkey primary key (snack_id),
constraint Snacks2_snack_name_key unique (snack_name),
constraint Snacks_user_id_fkey foreign key (user_id) references auth.users (id) on update cascade on delete set null
) tablespace pg_default;
create table
public."Votes" (
vote_id bigint generated by default as identity,
created_at timestamp with time zone not null default now(),
snack_id uuid null,
user_id uuid null,
vote public.vote_type not null,
constraint Votes_pkey primary key (vote_id),
constraint Votes_snack_id_fkey foreign key (snack_id) references "Snacks" (snack_id),
constraint Votes_user_id_fkey foreign key (user_id) references auth.users (id)
) tablespace pg_default;
snack_category: sweet, savory, healthy, drink
vote_type: up, down
git clone git@github.com:Lissy93/cso.git && cd cso
- Grab the codeyarn install
- Install dependenciescp .env.sample .env
- Then paste your Supabase URL and anon keyyarn dev
- Start the dev server. Then pop openlocalhost:5173
You'll also need to create a Supabase project, and run the import script listed in above.
Contributions of any kind are very welcome, and would be much appreciated. For Code of Conduct, see Contributor Convent.
To get started, fork the repo, follow the development steps above, add, commit and push the code, then come back here to open a pull request. If you're new to GitHub or open source, I have some guides in Lissy93/git-into-open-source which might help - but feel free to ask if you need any help.
Lissy93/CSO is licensed under MIT © Alicia Sykes 2023.
For information, see TLDR Legal > MIT
Expand License
The MIT License (MIT)
Copyright (c) Alicia Sykes <alicia@omg.com>
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sub-license, and/or sell
copies of the Software, and to permit persons to whom the Software is furnished
to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included install
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED,
INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANT ABILITY, FITNESS FOR A
PARTICULAR PURPOSE AND NON INFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT
HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE
SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
© Alicia Sykes 2023
Licensed under MIT
Thanks for visiting :)