Coder Social home page Coder Social logo

stanlylife / sbanken Goto Github PK

View Code? Open in Web Editor NEW
5.0 2.0 1.0 1.41 MB

An application that allows the user to monitor their bank transactions and spending. Built on top of Sbanken API with React

Home Page: sbanken.vercel.app

HTML 0.86% JavaScript 2.62% TypeScript 84.88% SCSS 11.63%
accounting banking-applications react

sbanken's Introduction

Service stopped from 22. march 2024

image

๐Ÿ“” Sbanken forbruk - Table of contents

๐ŸŒŸ About the Project

This application lets you view your spending and transactions in a summarized view. Some transactions are categorized and can be viewed under the Kategorier tab. You are also able to go back and forward in time by selecting a time range.

๐Ÿ“ท Screenshots

screenshot

๐Ÿ‘พ Tech Stack

Client
Devops

๐ŸŽฏ Features

Home page

Basic overview of account, recent transactions, grouped transactions image

Lister

View an overview of grouped transactions and recent transactions in gridview image

Kategorier

View categorized transactions image

Time range selector

  • Allows the user to navigate to previous and next month by using chevrons
  • Allows the user to select a time range by clicking on the calendar
  • You cannot move to a date greater than yesterday image image

๐ŸŽจ Color Reference

Color Hex
Primary Color #FFFFFF --color_a_100
Secondary Color #262342 --color_b_100
Accent Color #32fcb3 --color_c_100
Text Color #262342 or #FFFFFF

๐Ÿงฐ Getting Started

โ€ผ๏ธ Prerequisites

This project uses NPM as package manager https://docs.npmjs.com/downloading-and-installing-node-js-and-npm

โš™๏ธ Installation

Install my-project with npm

  mpm i

๐Ÿงช Running Tests

Tests have not been prioritized in this application, however i did add a few minor test cases for fun

To run tests, run the following command

  npm run test

๐Ÿƒ Run Locally

Clone the project

  git clone https://github.com/StanlyLife/Sbanken

Install dependencies

  npm i

Start the server

  npm run start

๐Ÿ‘€ Usage

You can login using your own API Secret and API key or you can click test to login using test data. With test data you are unable to select dates as the test data only provides data for 1 month.

image

Sbanken developer portal (utvikler portal)

Api Key

  • Go to the developer portal
  • Find your key as displayed in the image (The api key shown is not my actual key) image

Api Secret

  • Go to the developer portal
  • Order new password image
  • Fill out the information image -Copy key

๐Ÿงญ Roadmap

  • Add overview/home
  • Add grid/view
  • Add categories
  • Add login and test data
  • Refactor code
  • Clean up code
  • Performance improvements

Note: This app was intended to be a lot smaller than it currently is. Due to this reason i picket up a lot of technical debt. The technical debt has not been resolved and i do not plan on continuing work on this application until Sbanken improves or extends thei API.

๐Ÿ‘‹ Contributing

Contributions are always welcome!

โš ๏ธ License

Licence type: MIT

Copyright 2022 Stian Hรฅve

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

๐Ÿค Contact

Linkedin Badge - Stian Hรฅve

Acknowledgements

Sbanken API: https://publicapi.sbanken.no/openapi/apibeta/index.html

sbanken's People

Contributors

stanlylife avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar

Recommend Projects

  • React photo React

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

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

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

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo 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.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

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

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.