{"id":23107876,"url":"https://github.com/bebofofum/react-stream-schedule-client","last_synced_at":"2026-04-28T12:37:35.076Z","repository":{"id":177442897,"uuid":"401408273","full_name":"bebofofum/react-stream-schedule-client","owner":"bebofofum","description":"Stream Scheduler built with React(possibly Redux) to compliment the Rails API. Ability to see full stream listing, add streams and see stream details. File uploads.","archived":false,"fork":false,"pushed_at":"2024-05-23T20:40:00.000Z","size":1217,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-04-03T22:44:16.592Z","etag":null,"topics":["javascript","jsx","react","react-router"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/bebofofum.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2021-08-30T16:15:32.000Z","updated_at":"2024-05-23T20:40:04.000Z","dependencies_parsed_at":"2025-02-09T10:41:26.454Z","dependency_job_id":"a6d52a9c-f24a-49ca-afe4-2cf35cfa08ab","html_url":"https://github.com/bebofofum/react-stream-schedule-client","commit_stats":null,"previous_names":["bebofofum/react-stream-schedule-client"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/bebofofum/react-stream-schedule-client","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bebofofum%2Freact-stream-schedule-client","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bebofofum%2Freact-stream-schedule-client/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bebofofum%2Freact-stream-schedule-client/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bebofofum%2Freact-stream-schedule-client/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/bebofofum","download_url":"https://codeload.github.com/bebofofum/react-stream-schedule-client/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bebofofum%2Freact-stream-schedule-client/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":262343799,"owners_count":23296397,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["javascript","jsx","react","react-router"],"created_at":"2024-12-17T01:16:22.353Z","updated_at":"2026-04-28T12:37:34.924Z","avatar_url":"https://github.com/bebofofum.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# React Stream Schedule Client\n\nCreated a new react app\n\n```bash\nnpx create-react-app react-scheduler-client\n```\n\nor clone repo.\n\n## Add React Router\n```bash\nyarn add react-router-dom\n```\n\nStart with clean slate so remove the following files\n-App.css\n-App.test.js\n-Index.css\n-logo.svg\n-reportWebVitals.js\n-setupTests.js\n\nAlso clear out App.js all but outer Div. And remove references to deleted files in index and app.js. So remove imports and function calls to those components, css and logos that were just deleted.\n\nStart react dev server to test\n\n```bash\nyarn start\n```\n\nNew Stream Form container with route 'user/:userId/streams/new'?\n\n## AddStreamForm\n\nWhen we try to make a POST request without having an associated user for our Stream we get a 422 Unprocessable Entity error in our Inspector Network tab. This indicates a problem in the API, in our Rails controllers. First, check strong parameters in the Stream controller.\n\nWe can make a current_user by making a new user instance like so:\n\n```rb\nclass ApplicationController \u003c ActionController::API\n\n    def current_user \n        User.first_or_create(email: 'test@test.com', password: 'password')\n    end\n    \nend\n```\n\nThen in our Stream controller an instance of our Stream is created as an association of the current_user.\n\n```rb\n  def create\n    @stream = current_user.streams.build(stream_params)\n\n    if @stream.save\n      render json: @stream, status: :created, location: @stream\n    else\n      render json: @stream.errors, status: :unprocessable_entity\n    end\n  end\n  ```\n\n  Since I am creating an instance of our stream based on the current_user I don't need to include :user_id as part of the strong params because the user will be already attached when creating the stream instance rather than being passed as part of making the stream instance.\n\n  If we had another id such as an associated, such as if the stream also belong_to a group and we needed a group id passed when we make our Post request we could add the :group_id into our stream_params.\n\n  So now when we submit the form the data is persisted to the database!\n\n  # Next we make our views for Show each individual Stream. (a details page if you will)\n\n  ```bash\n  touch src/containers/StreamShowContainer.js\n  ```\n\n  This component will fetch from our api based on the element id requested to our stream controller. Something like \n  ```\n  fetch('http://localhost:3001/streams/1)\n\n\n# Add details about Redux\n\n\n\n\n\n\n\n\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbebofofum%2Freact-stream-schedule-client","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fbebofofum%2Freact-stream-schedule-client","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbebofofum%2Freact-stream-schedule-client/lists"}