{"id":18353064,"url":"https://github.com/thecodeholic/livewire-projects","last_synced_at":"2025-04-06T11:33:17.074Z","repository":{"id":41274445,"uuid":"508959559","full_name":"thecodeholic/livewire-projects","owner":"thecodeholic","description":"Beginner friendly livewire projects","archived":false,"fork":false,"pushed_at":"2022-07-01T06:54:59.000Z","size":275,"stargazers_count":71,"open_issues_count":0,"forks_count":35,"subscribers_count":5,"default_branch":"main","last_synced_at":"2025-03-21T22:41:30.273Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"PHP","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/thecodeholic.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}},"created_at":"2022-06-30T06:26:12.000Z","updated_at":"2025-02-08T15:17:28.000Z","dependencies_parsed_at":"2022-08-02T13:16:56.677Z","dependency_job_id":null,"html_url":"https://github.com/thecodeholic/livewire-projects","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/thecodeholic%2Flivewire-projects","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/thecodeholic%2Flivewire-projects/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/thecodeholic%2Flivewire-projects/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/thecodeholic%2Flivewire-projects/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/thecodeholic","download_url":"https://codeload.github.com/thecodeholic/livewire-projects/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247478152,"owners_count":20945258,"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":[],"created_at":"2024-11-05T21:38:24.504Z","updated_at":"2025-04-06T11:33:15.717Z","avatar_url":"https://github.com/thecodeholic.png","language":"PHP","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Livewire projects for beginners\n\n## Installation\n1. Clone the project\n2. Go to the project root directory and run `composer install` and `npm install`\n3. Create `.env` file and copy content from `.env.example`\n4. Run `php artisan key:generate --ansi` from terminal\n5. Create database file `database/database.sqlite`\n6. Run migrations by executing `php artisan migrate`\n7. Start the project by running `php artisan serve`\n8. Start the vite server (for serving css and js files) by running `npm run dev`\n\n------\n### Project #0 - Simple Counter\nA single counter number with + and - buttons to increase or decrease the number. Simplest example how you can create dynamic page without writing JavaScript.\n\u003cbr\u003e\n\u003ca href=\"https://imgur.com/Pn2Wy91\"\u003e\u003cimg src=\"https://i.imgur.com/Pn2Wy91.png\" title=\"source: imgur.com\" /\u003e\u003c/a\u003e\n\u003cbr\u003e\n\u003ca href=\"https://imgur.com/9oZn9hP\"\u003e\u003cimg src=\"https://i.imgur.com/9oZn9hP.png\" title=\"source: imgur.com\" /\u003e\u003c/a\u003e\n\n### Project #1 - Calculator\nVery simple Calculator with with +, -, *, /, % operations. It has two inputs and one dropdown for operation and = button to calculate result.\n\u003cbr\u003e\n\u003ca href=\"https://imgur.com/Jq4OhdQ\"\u003e\u003cimg src=\"https://i.imgur.com/Jq4OhdQ.png\" title=\"source: imgur.com\" /\u003e\u003c/a\u003e\n\u003cbr\u003e\n\u003ca href=\"https://imgur.com/eYgcOR7\"\u003e\u003cimg src=\"https://i.imgur.com/eYgcOR7.png\" title=\"source: imgur.com\" /\u003e\u003c/a\u003e\n\n### Project #2 - Simple todo list\nApplication made quantillion times. In this case it is made with livewire and Eloquent model. The data is saved, updated and deleted from the database.\n\u003cbr\u003e\n\u003ca href=\"https://imgur.com/1QEnRvC\"\u003e\u003cimg src=\"https://i.imgur.com/1QEnRvC.png\" title=\"source: imgur.com\" /\u003e\u003c/a\u003e\n\n### Project #3 - Cascading dropdown\nCascading dropdown for continents and countries, you choose continent and countries are filtered based on it. Loading indicator is displayed while countries are loading\n\u003cbr\u003e\n\u003ca href=\"https://imgur.com/Zhh9fS0\"\u003e\u003cimg src=\"https://i.imgur.com/Zhh9fS0.png\" title=\"source: imgur.com\" /\u003e\u003c/a\u003e\n\u003ca href=\"https://imgur.com/eDR3UMR\"\u003e\u003cimg src=\"https://i.imgur.com/eDR3UMR.png\" title=\"source: imgur.com\" /\u003e\u003c/a\u003e\n\u003ca href=\"https://imgur.com/YZoYJBx\"\u003e\u003cimg src=\"https://i.imgur.com/YZoYJBx.png\" title=\"source: imgur.com\" /\u003e\u003c/a\u003e\n\n### Project #4 - Product search and pagination\nWe have products table with multiple columns and pagination links and search input field. The data comes from the database and search keyword is saved in the URL. So when you refresh the page the content is filtered.\n\u003cbr\u003e\n\u003ca href=\"https://imgur.com/HqHVSpU\"\u003e\u003cimg src=\"https://i.imgur.com/HqHVSpU.png\" title=\"source: imgur.com\" /\u003e\u003c/a\u003e\n\u003cbr\u003e\n\u003ca href=\"https://imgur.com/et7kJhl\"\u003e\u003cimg src=\"https://i.imgur.com/et7kJhl.png\" title=\"source: imgur.com\" /\u003e\u003c/a\u003e\n\n### Project #5 - Image Upload\n - Possibility to upload multiple images. \n - Have preview before submitting. \n - Images are validated on submit.\n - Images are saved on local file system\n - All uploaded images are displayed even after page reload\n\u003cbr\u003e \n\u003ca href=\"https://imgur.com/Z1WuXgE\"\u003e\u003cimg src=\"https://i.imgur.com/Z1WuXgE.png\" title=\"source: imgur.com\" /\u003e\u003c/a\u003e\n\n\n### Project #6 - Registration form validation\nVery simple registration form with the following fields: \n - customer role (radio list with two options: customer, vendor), \n - first_name\n - last_name\n - email\n - password\n - company_name\n - vat_number\n\ncompany_name and vat_number fields are only displayed and are required if role is **vendor**.\nWhen you submit the form validation messages are displayed. As soon as you type in the inputs realtime validation happens and error messages are updated or hidden.\nEvery input has debounce on validation so that too many ajax requests are not sent. \u003cbr\u003e\nWhen the validation passes, session flash message is displayed.\n\n\u003cbr\u003e\n\u003ca href=\"https://imgur.com/Qku0EXj\"\u003e\u003cimg src=\"https://i.imgur.com/Qku0EXj.png\" title=\"source: imgur.com\" /\u003e\u003c/a\u003e\n\u003cbr\u003e\n\u003ca href=\"https://imgur.com/TLKM9YG\"\u003e\u003cimg src=\"https://i.imgur.com/TLKM9YG.png\" title=\"source: imgur.com\" /\u003e\u003c/a\u003e\n\u003cbr\u003e\n\u003ca href=\"https://imgur.com/n3JHqKt\"\u003e\u003cimg src=\"https://i.imgur.com/n3JHqKt.png\" title=\"source: imgur.com\" /\u003e\u003c/a\u003e\n\u003cbr\u003e\n\u003ca href=\"https://imgur.com/S22AX3d\"\u003e\u003cimg src=\"https://i.imgur.com/S22AX3d.png\" title=\"source: imgur.com\" /\u003e\u003c/a\u003e\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fthecodeholic%2Flivewire-projects","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fthecodeholic%2Flivewire-projects","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fthecodeholic%2Flivewire-projects/lists"}