Todolist-frontend Application
Frontend for https://github.com/guillaumebriday/todolist-backend-laravel app, built for a serie of articles on my blog.
If you want to see this project with Nuxt.js I created the same application available here: todolist-frontend-nuxt.
The purpose of this repository is to consume API, provide by a Laravel Application, with the Vue.js JavaScript front-end framework.
Some of the tools used in this project
- Vue.js
- vue-router with Lazy Loading Routes
- vue-test-utils
- vuex
- axios
- moment.js
- Laravel Echo
- Webpack
- webpack-dev-server
- Tailwind CSS
Installation
Development environment requirements :
Setting up your development environment on your local machine :
$ git clone https://github.com/guillaumebriday/todolist-frontend-vuejs.git
$ cd todolist-frontend-vuejs
$ cp .env.example .env
$ docker-compose run --rm node yarn
$ docker-compose run --service-ports --rm node yarn hot
Useful commands
Building the app :
$ docker-compose run --rm node yarn dev
# Or
$ docker-compose run --rm node yarn watch
# Or
$ docker-compose run --rm node yarn production
Running ESLint :
$ docker-compose run --rm node yarn lint
Running tests :
$ docker-compose run --rm node yarn test
Broadcasting & WebSockets
Before using WebSockets, you need to set the PUSHER_APP_KEY
key in your .env file.
You could generate a key on https://pusher.com/.
Deploy in production
This application is hosted on Netlify and available on https://todolist.guillaumebriday.me/.
More details
More details are available on my blog post : https://guillaumebriday.fr/laravel-vuejs-faire-une-todo-list-partie-1-presentation-et-objectifs (French).
Contributing
Do not hesitate to contribute to the project by adapting or adding features ! Bug reports or pull requests are welcome.
License
This project is released under the MIT license.
Bug: Todos don't show up after a new account is created, unless you reload the page
Issue: Create a brand new account at https://todolist.guillaumebriday.xyz/
You land on https://todolist.guillaumebriday.xyz/app/active Then, start adding Todos, but NONE of them show up until you reload the page.
I think this is a bug here.
Question: Where is the Laravel API code?
Thanks for the demo at https://todolist.guillaumebriday.xyz/ Looks cool but I'm wondering if there's an end-to-end example that uses Laravel for the API /backend? Am I missing something?
Installation problems
Steps I followed: $ git clone https://github.com/guillaumebriday/todolist-frontend-vuejs.git $ cd todolist-frontend-vuejs $ npm install
Run: $ cp .env.example .env Otherwise you will see:
Then Run: $ npm run hot
and it just hangs there...nothing happens.
Also, what URL am I supposed to go to after this issue is resolved? Too many questions preventing me from getting this working end-to-end. The tutorial at https://guillaumebriday.fr/laravel-vuejs-faire-une-todo-list-partie-4-installer-l-application-frontend-avec-webpack is a bit too complicated - I first want to make sure that this will even work on my local machine.
Update dependency eslint to v6.2.2
This PR contains the following updates:
| Package | Type | Update | Change | |---|---|---|---| | eslint (source) | devDependencies | patch |
6.2.1
->6.2.2
|Release Notes
eslint/eslint
v6.2.2
Compare Source
0e0b784
Upgrade: espree@^6.1.1 (#12158) (Kevin Partington)04e859f
Sponsors: Sync README with website (ESLint Jenkins)34783d1
Sponsors: Sync README with website (ESLint Jenkins)b809e72
Docs: Update README team and sponsors (ESLint Jenkins)Renovate configuration
:date: Schedule: At any time (no schedule defined).
:vertical_traffic_light: Automerge: Enabled.
:recycle: Rebasing: Whenever PR becomes conflicted, or if you modify the PR title to begin with "
rebase!
".:no_bell: Ignore: Close this PR and you won't be reminded about this update again.
This PR has been generated by Renovate Bot. View repository job log here.
Update dependency eslint-config-standard to v14.0.1
This PR contains the following updates:
| Package | Type | Update | Change | |---|---|---|---| | eslint-config-standard | devDependencies | patch |
14.0.0
->14.0.1
|Release Notes
standard/eslint-config-standard
v14.0.1
Compare Source
Renovate configuration
:date: Schedule: At any time (no schedule defined).
:vertical_traffic_light: Automerge: Enabled.
:recycle: Rebasing: Whenever PR becomes conflicted, or if you modify the PR title to begin with "
rebase!
".:no_bell: Ignore: Close this PR and you won't be reminded about this update again.
This PR has been generated by Renovate Bot. View repository job log here.
Update Font Awesome (patch)
This PR contains the following updates:
| Package | Type | Update | Change | |---|---|---|---| | @fortawesome/fontawesome-svg-core (source) | dependencies | patch |
1.2.21
->1.2.22
| | @fortawesome/free-brands-svg-icons (source) | dependencies | patch |5.10.1
->5.10.2
| | @fortawesome/free-regular-svg-icons (source) | dependencies | patch |5.10.1
->5.10.2
| | @fortawesome/free-solid-svg-icons (source) | dependencies | patch |5.10.1
->5.10.2
|Release Notes
FortAwesome/Font-Awesome
v5.10.2
Compare Source
Added
Changed
Fixed
Renovate configuration
:date: Schedule: At any time (no schedule defined).
:vertical_traffic_light: Automerge: Enabled.
:recycle: Rebasing: Whenever PR becomes conflicted, or if you modify the PR title to begin with "
rebase!
".:ghost: Immortal: This PR will be recreated if closed unmerged. Get config help if that's undesired.
This PR has been generated by Renovate Bot. View repository job log here.
Update dependency eslint to v6.2.1 - autoclosed
This PR contains the following updates:
| Package | Type | Update | Change | |---|---|---|---| | eslint (source) | devDependencies | minor |
6.1.0
->6.2.1
|Release Notes
eslint/eslint
v6.2.1
Compare Source
8c021b5
Upgrade: eslint-utils 1.4.2 (#12131) (Toru Nagashima)e82388b
Sponsors: Sync README with website (ESLint Jenkins)4aeeeed
Docs: update docs for ecmaVersion 2020 (#12120) (silverwind)6886148
Docs: Add duplicate keys limitation to accessor-pairs (#12124) (Milos Djermanovic)v6.2.0
Compare Source
fee6acb
Update: support bigint and dynamic import (refs #11803) (#11983) (Toru Nagashima)afd8012
New: noInlineConfig setting (refs eslint/rfcs#22) (#12091) (Toru Nagashima)3d12378
Update: Fix accessor-pairs to enforce pairs per property in literals (#12062) (Milos Djermanovic)8cd00b3
New: function-call-argument-newline (#12024) (finico)30ebf92
Fix: prefer-template autofix produces syntax error with octal escapes (#12085) (Milos Djermanovic)13c3988
Fix: Check literal type explicitly in dot-notation (#12095) (Milos Djermanovic)3e5ceca
Fix: Handle empty string property names in getFunctionNameWithKind (#12104) (Milos Djermanovic)9a043ff
Fix: no-duplicate-case false positives on Object.prototype keys (#12107) (Milos Djermanovic)fe631af
Chore: minor typo fix (#12112) (James George)4cb7877
Fix: fix no-extra-parens ignores some nodes (#11909) (Pig Fang)2dc23b8
Update: fix no-dupe-keys false negatives on empty string names (#12069) (Milos Djermanovic)19ab666
Fix: yoda exceptRange false positives on empty string property names (#12071) (Milos Djermanovic)d642150
Update: Check empty string property names in sort-keys (#12073) (Milos Djermanovic)acce6de
Fix: class-methods-use-this reports 'undefined' names (#12103) (Milos Djermanovic)92ec2cb
Fix: Allow bind call with a single spread element in no-extra-bind (#12088) (Milos Djermanovic)bfdb0c9
Fix: no-extra-boolean-cast invalid autofix for Boolean() without args (#12076) (Milos Djermanovic)34ccc0c
Chore: Remove TDZ scope type condition from no-unused-vars (#12055) (Milos Djermanovic)01d38ce
Docs: Remove TDZ scope from the scope manager interface documentation (#12054) (Milos Djermanovic)1aff8fc
Update: warn about mixing ternary and logical operators (fixes #11704) (#12001) (Karthik Priyadarshan)11be2f8
Docs: do not recommend global-installed usage (#12016) (薛定谔的猫)cf31dab
Fix: no-restricted-syntax - correct the schema (#12051) (Brad Zacher)fbec99e
Update: fix class-methods-use-this false negatives with exceptMethods (#12077) (Milos Djermanovic)fb08b7c
Docs: Remove readonly/writable global logic from no-undef (fixes #11963) (#12053) (Milos Djermanovic)5b5934b
Sponsors: Sync README with website (ESLint Jenkins)9156760
Sponsors: Sync README with website (ESLint Jenkins)f5e0cc4
Update: Check computed method keys in no-extra-parens (#11973) (Milos Djermanovic)d961438
Docs: Fix Incorrect Documentation (#12045) (Michael Miceli)887d08c
Sponsors: Sync README with website (ESLint Jenkins)d90183f
Docs: add a case to func-names (#12038) (Chiawen Chen)8a5b62d
Docs: no use eslint.linter in code example (#12037) (薛定谔的猫)5831767
Update: report location of func-names (fixes #12022) (#12028) (Pig Fang)Renovate configuration
:date: Schedule: At any time (no schedule defined).
:vertical_traffic_light: Automerge: Enabled.
:recycle: Rebasing: Whenever PR becomes conflicted, or if you modify the PR title to begin with "
rebase!
".:no_bell: Ignore: Close this PR and you won't be reminded about this update again.
This PR has been generated by Renovate Bot. View repository job log here.
Update dependency tailwindcss to v1
This PR contains the following updates:
| Package | Type | Update | Change | |---|---|---|---| | tailwindcss (source) | dependencies | major |
^0.7.4
->^1.0.0
|Release Notes
tailwindcss/tailwindcss
v1.0.5
Compare Source
!important
directly in Tailwind utility pluginsv1.0.4
Compare Source
v1.0.3
Compare Source
@tailwind preflight
instead of@tailwind base
, this is the source of many support requestsv1.0.2
Compare Source
@screen
rules weren't bubbled properly when nested in plugins (#941)v1.0.1
Compare Source
v1.0.0
Compare Source
Renovate configuration
:date: Schedule: At any time (no schedule defined).
:vertical_traffic_light: Automerge: Disabled by config. Please merge this manually once you are satisfied.
:recycle: Rebasing: Whenever PR becomes conflicted, or if you modify the PR title to begin with "
rebase!
".:no_bell: Ignore: Close this PR and you won't be reminded about this update again.
This PR has been generated by Renovate Bot. View repository job log here.
Configure Renovate
Welcome to Renovate! This is an onboarding PR to help you understand and configure settings before regular Pull Requests begin.
:vertical_traffic_light: To activate Renovate, merge this Pull Request. To disable Renovate, simply close this Pull Request unmerged.
Detected Package Files
docker-compose.yml
(docker-compose)package.json
(npm)Configuration Summary
Based on the default config's presets, Renovate will:
renovate/
as prefix for all branch namesfix
for dependencies andchore
for all othersnode_modules
,bower_components
,vendor
and various test/tests directoriespackage.json
is modified:abcd: Would you like to change the way Renovate is upgrading your dependencies? Simply edit the
renovate.json
in this branch with your custom config and the list of Pull Requests in the "What to Expect" section below will be updated the next time Renovate runs.What to Expect
With your current configuration, Renovate will create 14 Pull Requests:
Pin dependencies
renovate/pin-dependencies
1.2.15
5.7.2
5.7.2
5.7.2
0.1.5
0.18.0
6.26.3
8.2.6
7.1.5
6.18.0
1.7.0
6.24.1
6.24.1
5.0.0
5.2.0
2.1.0
1.7.0
5.15.1
12.0.0
2.16.0
8.0.1
4.0.1
4.0.0
5.2.2
24.1.0
3.0.1
3.1.0
3.2.0
13.2.0
3.0.2
1.5.3
1.11.4
0.5.0
6.0.2
1.1.0
2.24.0
4.11.0
3.0.0
1.4.0
4.4.0
7.1.0
0.23.1
0.7.4
2.6.8
5.16.2
2.2.2
1.0.0-beta.10
15.7.0
3.0.2
2.6.8
1.0.0-beta.11
3.1.0
4.29.6
3.2.3
3.2.1
4.2.1
1.0.0
Update Font Awesome
renovate/font-awesome
1.2.17
5.8.1
5.8.1
5.8.1
0.1.6
Update dependency copy-webpack-plugin to v5.0.2
renovate/copy-webpack-plugin-5.x
5.0.2
Update dependency css-loader to v2.1.1
renovate/css-loader-2.x
2.1.1
Update dependency eslint to v5.16.0
renovate/eslint-5.x
5.16.0
Update dependency eslint-plugin-promise to v4.1.1
renovate/eslint-plugin-promise-4.x
4.1.1
Update dependency expect to v24.7.1
renovate/jest-monorepo
24.7.1
Update dependency luxon to v1.12.0
renovate/luxon-1.x
1.12.0
Update dependency vue-analytics to v5.16.4
renovate/vue-analytics-5.x
5.16.4
Update dependency webpack-cli to v3.3.0
renovate/webpack-cli-3.x
3.3.0
Update vue monorepo to v2.6.10
renovate/vue-monorepo
2.6.10
2.6.10
Update dependency babel-eslint to v10
renovate/babel-eslint-10.x
10.0.1
Update dependency babel-loader to v8
renovate/babel-loader-8.x
8.0.5
Update dependency jsdom to v14
renovate/jsdom-14.x
14.0.0
:children_crossing: Branch creation will be limited to maximum 2 per hour, so it doesn't swamp any CI resources or spam the project. See docs for
prhourlylimit
for details.:question: Got questions? Check out Renovate's Docs, particularly the Getting Started section. If you need any further assistance then you can also request help here.
This PR has been generated by Renovate Bot. View repository job log here.
Update dependency cross-env to v6
This PR contains the following updates:
| Package | Type | Update | Change | |---|---|---|---| | cross-env | devDependencies | major |
5.2.1
->6.0.0
|Release Notes
kentcdodds/cross-env
v6.0.0
Compare Source
Bug Fixes
BREAKING CHANGES
Renovate configuration
:date: Schedule: At any time (no schedule defined).
:vertical_traffic_light: Automerge: Disabled by config. Please merge this manually once you are satisfied.
:recycle: Rebasing: Whenever PR becomes conflicted, or if you modify the PR title to begin with "
rebase!
".:no_bell: Ignore: Close this PR and you won't be reminded about this update again.
This PR has been generated by Renovate Bot. View repository job log here.
Update dependency eslint-plugin-node to v10
This PR contains the following updates:
| Package | Type | Update | Change | |---|---|---|---| | eslint-plugin-node | devDependencies | major |
9.2.0
->10.0.0
|Release Notes
mysticatea/eslint-plugin-node
v10.0.0
Compare Source
This release supports BigInt and Dynamic Imports if you are using ESLint 6.2.0 or later.
💥 Breaking Changes
9ea67c9
updatednode/no-unsupported-features/es-syntax
rule to recognize BigInt literals andimport()
.b91b48d
updatednode/no-unsupported-features/es-builtins
rule to recognizeBigInt
,BigInt64Array
,BigUint64Array
, andPromise.allSettled
.b57a4f9
updatednode/file-extension-in-import
,node/no-extraneous-import
,node/no-missing-import
, andnode/no-unpublished-import
rules to recognizeimport()
.4b9c4d7
updatednode/no-deprecated-api
rule to recognizemodule.createRequireFromPath
.9c574ba
updatedplugin:node/recommended
and the other configs.node/no-exports-assign
rule.exports
global variable writable.node/*-import
rules in CommonJS mode as well.✨ New rules
a0f0ee1
addednode/no-exports-assign
rule that disallowsexports = {}
.Renovate configuration
:date: Schedule: At any time (no schedule defined).
:vertical_traffic_light: Automerge: Disabled by config. Please merge this manually once you are satisfied.
:recycle: Rebasing: Whenever PR becomes conflicted, or if you modify the PR title to begin with "
rebase!
".:no_bell: Ignore: Close this PR and you won't be reminded about this update again.
This PR has been generated by Renovate Bot. View repository job log here.