Light

carlosazaustre / vue-trello Goto Github PK

View Code? Open in Web Editor NEW

222.0 14.0 62.0 669 KB

Trello clone with Vue.js for educational purposes

License: MIT License

JavaScript 67.93% HTML 1.38% Vue 30.69%

vuejs2 vue vuejs vuex vuex-demo firebase firebase-database

vue-trello's Introduction

vue-trello

Trello clone with Vue and Vuex

YouTube video tutorial (Spanish speaking)

▶️ https://www.youtube.com/watch?v=Wd9dOIlTWCc

Screenshots

Features

Vue.js v2
Vuex v2
Handle state with actions and mutations (Vuex)
Getters to manage partial state in Components
Scoped styles with Sass/SCSS
User can create multiple boards, lists and tasks
Vue-Router to show different boards
Persistence with Firebase

Next steps

User authentication
Create Vuex modules when the app grow with new features
Lazy loading modules in Vuex and Route based components

Configure

Create a new project on Firebase Console and then create a web app and copy the configuration object.

Rename src/firebase/settings.js.sample to src/firebase/settings.js and paste it the firebase configuration project.

Open .firebaserc file and change the value of default project for your just created firebase project.

Build Setup

# install dependencies
npm install

# serve with hot reload at localhost:8080
npm run dev

# build for production with minification
npm run build

# build for production and view the bundle analyzer report
npm run build --report

For detailed explanation on how things work, checkout the guide and docs for vue-loader.

vue-trello's People

Contributors

Stargazers

Watchers

Forkers

sernalab dukenst2006 baumannzone gianverab agusrdz itamaradin15 nauzethc jeremykenedy h2jose oscarcp777 masatakashida liangzuan1983 intcastillo trendingtechnology yazashin syedpeer shuvo2062 sabaljayson viktortat miiglesi thinkamacademy-br sparrow-net-pl albererre jajamoks highdevs echaouqui alexanderg15 tomofu74 panchourgiles igordahora jmfegu xiaoyang1012 hcdestroyer silverfantacy massimiliano76 rkd0812 fininhors leandrouti delta94 ollivr chaizeg mashiane ecanro vtorresm julian-gamboa-ensino guillermoarce kutyel chrisbnd mhartyn analistadeperon ginolucianorojo1993 jaumebt90 signordavid frc90 diunexy18 jorgeaugusto leonardorosas92 saramarin23 5807473 sergio7bd siabdel

vue-trello's Issues

Configuration project in Firebase

Hi Carlos, thanks for sharing this resources.

I have a questions with the readme...in the text "..Create a new project on Firebase Console and then create a web app and copy the configuration object."

Where is te configuration object in the project?

thanks!

Permission Denied

Hey there,

Curious to check out the app just for fun. I'm getting a permission denied, something to do with the firebase connection. Your setup instructions:

Rename src/firebase/settings.js.sample to src/firebase/settings.js and paste it the firebase configuration project

You don't have a firebase dir, "settings.js.sample" is located in the /api folder. I've never used firebase before but Im pretty sure I've set things up properly. My specific errors:

FIREBASE WARNING: set at /boards/-L3JvCzYKK6M-bEfSzES failed: permission_denied

Uncaught (in promise) Error: PERMISSION_DENIED: Permission denied
at eval (Repo.js?6ebd:510)
at Object.exports.exceptionGuard (util.js?54b5:556)
at Repo.callOnCompleteCallback (Repo.js?6ebd:501)

etc

Any suggestions?

Recommend Projects

React

A declarative, efficient, and flexible JavaScript library for building user interfaces.
Vue.js

🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
Typescript

TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
TensorFlow

An Open Source Machine Learning Framework for Everyone
Django

The Web framework for perfectionists with deadlines.
Laravel

A PHP framework for web artisans
D3

Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

javascript

JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
web

Some thing interesting about web. New door for the world.
server

A server is a program made to process requests and deliver data to clients.
Machine learning

Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Visualization

Some thing interesting about visualization, use data art
Game

Some thing interesting about game, make everyone happy.

Recommend Org

Facebook

We are working to build community through open source technology. NB: members must have two-factor auth.
Microsoft

Open source projects and samples from Microsoft.
Google

Google ❤️ Open Source for everyone.
Alibaba

Alibaba Open Source for everyone
D3

Data-Driven Documents codes.
Tencent

China tencent open source team.