This app is part of our final project in our Agile course and Web application course at IT-Högskolan in Gothenburg. The purpose is to create a complete fullstack app (this being the frontend) for some sort of quiz focused on learning using the Agile software development approach and Scrum

Overview

Paefax Language Quiz project

build pulls

This app is part of our final project in our Agile course and Web application course at IT-Högskolan in Gothenburg.

The purpose is to create a complete fullstack app (this being the frontend) for some sort of quiz focused on learning using the Agile software development approach and Scrum. We decided to make a language learning app, taking inspiration from apps like Duolingo and the like.

We use Trello, a Scrum master and development team, with our teacher Kevin as our customer and product owner. Trying our best to follow a professional and structured approach of an agile team with regular sprints (one week sprints), daily-stand-ups, reviews and retrospectives every end of sprint.

Project Setup

Clone this repository

https://github.com/Paefax/paefax-language-app.git

Install dependencies in local repository

npm install

Compile and start hot-reload server

npm run dev

Useful links

Agile board, where we have our user stories, backlog, current sprint log and where we plan and execute our work.

LoFi wireframe, our first draft for the look of the frontend with basic functionality.

HiFi wireframe, our LoFi with added color theme and fonts.

Backend repository, our backend repository.

Project members

Philippe Vial | Felix Jacobsen | Fredrik Eriksson | Helena Eklund | Patrik Fallqvist Magnusson

Technologies

IDE TRELLO FIGMA VUE NODE EXP SQL

Comments
  • Bug fix 01: Progress bar & Quiz reset

    Bug fix 01: Progress bar & Quiz reset

    This will fix the quiz not resetting when exiting out of the quiz mid-question. This also adds resetting of quiz when exiting result page, and the ability to exit mid quiz and start over with the same words.

    opened by LordRekishi 6
  • Media queries & Refactor

    Media queries & Refactor

    Adding basic media queries for all pages, and doing some minor refactoring to follow HiFi wireframe better. FYI, this is done before merging the footer. So if we merge the footer first, we might have to do some minor tweaks.

    opened by LordRekishi 4
  • Bug Fix: Click on same answers multiple times

    Bug Fix: Click on same answers multiple times

    This will fix the bug where you could click on answers multiple times before you click "Next Question". This will solve it, you can still click multiple times but only your first click registers.

    opened by LordRekishi 1
  • Bugfix language category

    Bugfix language category

    This will:

    • remove general store (only use quiz store) since the language and category was saved twice.
    • save category and language to localstorage
    • Fix Bug: when reloading page language and category is set to fruit and swedish.

    note: if you update the page during a quiz you will have to retake the quiz and there will be new questions. Since the quiz is short we think this is an ok bahaviour.

    opened by helenahalldiniths 1
  • Adds transition to all routes (not inside of quiz)

    Adds transition to all routes (not inside of quiz)

    This adds transition to all routes, however it doesn't work inside of the quiz since the quiz itself is only one route that changes its content. We can look at this more in the future

    opened by helenahalldiniths 0
  • Enable eslint

    Enable eslint

    I have used this as a reference: https://vueschool.io/articles/vuejs-tutorials/eslint-and-prettier-with-vite-and-vue-js-3/

    There is a few issues with using ESLint at the moment. I think they occur due to settings overriding the settings of ESLint and prettier formating.

    There is a few settings that is recommended to enable for ESLint and Prettier formating to work optimally. Best way is to copy and paste these into settings.json

    
      "editor.formatOnSave": true,
      "editor.codeActionsOnSave": {
        "source.fixAll.eslint": true
      },
    "[vue]": {
      "editor.defaultFormatter": "esbenp.prettier-vscode"
    },
    "[javascript]": {
      "editor.defaultFormatter": "esbenp.prettier-vscode"
    },
    "eslint.validate": ["javascript","vue"],
    
    

    Easy way to enter settings.json Windows: ----> %APPDATA%\Code\User\settings.json

    We can simply add rules and exceptions in eslintrc.js --> rules. They can be found here.

    I will draft this and check with Kevin.

    opened by FelixJacobsen 1
  • Retake quiz functionality

    Retake quiz functionality

    This adds a rudimentary retake functionality.

    1. Added Default questions array, in order to save original list of questions for restart of program
    2. Added RetakeView which is very similar to the QuizView, but with some differences in OnMounted and how we handle wrong answers
    3. Added functions to add and remove wrong answered questions i store
    4. Added reset to default function when pressing the home button
    5. Added retake button to appear when questions were answered wrong

    Very basic version, nothing fancy. This will need to be updated if we decide to go on with my code refactoring of the QuizView to make it easier to read. Will be an easy fix in that case.

    opened by LordRekishi 5
A starter template for building complete application using Node.js and Vue.js with some included packages and configurations to help start the development quickly.

Node-Vue-Template A starter template for building a complete application using Node.js and Vue.js with some included packages and configurations to he

Muhammad Ubaid Raza 72 Nov 2, 2022
Vue-quiz - Quiz application writing in Vue.

vue-quiz Project setup npm install Compiles and hot-reloads for development npm run serve Compiles and minifies for production npm run build Lints

Tiago Neves Caitano 0 Jan 3, 2022
Public Git mirror for the master-level DevOps course given every summer semester at Chalmers and the University of Gothenburg

Material for DAT490 (Architectures for Scale-Out Systems) (colloquially "the DevOps course") Here you find material used in teaching DAT490 (Architect

Internet Computing and Emerging Technologies lab (ICET-lab) 13 Aug 23, 2022
App that performs CRUD operations in which users can track projects, tasks under projects, total duration of each project and task. Project is being build with Nuxt js 3, Axios, Pinia, Bootstrap 5 and Vue composition API

Nuxt 3 Minimal Starter Look at the nuxt 3 documentation to learn more. Setup Make sure to install the dependencies: # yarn yarn install # npm npm ins

Sergio Terrero 2 Nov 1, 2022
I-ON communications developer training course final project

JewelryProject 쥬얼리 쇼핑몰 GGULUCK ?? Explore the docs » Table of Contents Team Members About The Project Preview Built With Support Team Members ??‍?? eu

CheolHo Cho 3 Feb 15, 2022
A fullstack webdevelopment project in a university course of the fourth semester.

A fullstack webdevelopment project in a university course of the fourth semester. My part was to create the frontend for the myMentor application. myMentor is digital platform to share knowledge an skills with other people.

Michael Gerischer 1 Nov 17, 2021
Small store project being built using Vue3, Supabase and Quasar framework

Small store project being built using Vue3, Supabase and Quasar framework, based on the application developed in the tutorial available on the Patrick Monteiro's channel.

Bruno Silva 2 Nov 18, 2022
NursingCenter - A comprehensive software development project, using Vue.js and SSM framework.

颐养中心(Nursing Center) 软件综合课程设计 大作业 本项目基于 Vue + SSM 框架开发,使用 Element UI 组件库。 林文威 [email protected] 李鹤 [email protected] 王彬瞻 吴宗辉 项目预览 运行项目 初始化数据库 创建名

Evan Lynn 0 Jan 3, 2022
We are XORNET this is a fun little project started by @Geoxor for people who have servers and don’t have shit to do with them
, our goal is to let people use our servers for themselves for cheap!

Information We are XORNET this is a fun little project started by @Geoxor for people who have servers and don’t have shit to do with them
, our goal i

George Tsotsos 12 Nov 29, 2021
Stable UI is a web user interface designed to generate, save, and view images using Stable Diffusion, with the goal being able to provide Stable Diffusion to anyone.

stable-ui Stable UI is a web user interface designed to generate, save, and view images using Stable Diffusion, with the goal being able to provide St

null 52 Jan 2, 2023
This project shows how to dockerize web application build using Vue JS web development framework for Java Script programming language.

vue-docker This project shows how to dockerize web application build using Vue JS web development framework for Java Script programming language. Requ

Denny Imanuel 1 Dec 27, 2021
Task nr 2 - Frontend Software Engineer. Web-app listing user's repositories based on their popularity.

user_repos Project setup npm install Compiles and hot-reloads for development npm run serve Compiles and minifies for production npm run build Lint

null 0 Jan 10, 2022
Clone of project for SMU project on web app development

is216-project IS216 - Group 14 - WAD Kings Stephanie Winata ([email protected]), Euan Chng Zhixiang ([email protected]), Shu

Eric Li 2 Feb 25, 2022
This repository contains a base networking framework for building a realtime quiz platform with Ably. This project uses VueJS on the client-side and NodeJS on the server-side and is scalable as you need.

A scalable, full-stack live quiz framework built with VueJS and NodeJS This repository contains a scalable framework for building a real-time quiz app

Ably Labs 47 Dec 14, 2022
S11 SUCCESS is a Vue application designed to administer a quiz to the employees of a company

[S11] SUCCESS Description S11 SUCCESS is a Vue application designed to administer a quiz to the employees of a company. The answers to the quizzes are

NOIZET Maxence 1 Feb 21, 2022
🔥SSAFY 4기 FINAL 자율 PROJECT🔥

?? THXSTORE_Link ✌ Name 박대현 성정욱 박상우 최동식 황영준 Profile Position Frontend & UI/UX Frontend & UI/UX 팀장 & Backend Develop Backend Develop & CI/CD Backend De

Park Sangwoo 8 Aug 12, 2022
Patika Full Stack Bootcamp Final Project

Final-Project-AtaTurkoglu Patika Full Stack Bootcamp Final Project no need to reload page or send new request after crud operations on table for updat

null 2 Dec 29, 2022
Restaurant-App - Complete application using Vue.js of a restaurant app.

Restaurant Description here. Project setup npm install Compiles and hot-reloads for development npm run serve Compiles and minifies for production n

Claudio Jorge Lopes Filho 3 May 16, 2022
A Vue component to use native sharing mechanism of the device as part of the Web Share API.

vue-navigator-share A Vue component to use native sharing mechanism of the device as part of the Web Share API. Support only https and mobile browser

Gabriel Bibiano 20 Nov 27, 2022