smallbusinesshero / storefront Goto Github PK
View Code? Open in Web Editor NEWLicense: MIT License
License: MIT License
The background image for both search result and store profile screen has too high contrast and is too far zoomed in. This might be related to the resolution of the screen, maybe some responsiveness issue?
Acceptance Criteria
We want to see the current sonarcloud report on the README page. Please add the following badge with the correct Sonarcloud project URL for the frontend and backend repo like this:
[![Sonarcloud Status](https://sonarcloud.io/api/project_badges/measure?project=com.lapots.breed.judge:judge-rule-engine&metric=alert_status)](https://sonarcloud.io/dashboard?id=com.lapots.breed.judge:judge-rule-engine)
Acceptance Criteria
Background
When I enter the website
I want to see a welcome screen and a search for a store based on the Kiez I live in
So I don't have to look through a list and find the store I care about
Acceptance Criteria
Technical Suggestions
Wireframe
https://drive.google.com/file/d/1fsMsL3sfRohywVW9LqMYAddd9JawaBje/view?usp=sharing
Open for discussion
I think it would be good if we structured the front end more sustainably.
I'd be open to take care of that, just give me green light for individual issues
We want to prevent users from entering their zip code by mistake.
On a mobile viewport, the store detail page extends horizontally past the screen. This results in horizontal scrolling.
Add prettier as a pre-commit hook to ensure that every file has the same style and identions
I tried to run both production and dev builds and both times I got the following error from Firefox:
An error occurred during a connection to localhost:3000. SSL received a record that exceeded the maximum permissible length.
Error code: SSL_ERROR_RX_RECORD_TOO_LONG
I get similar from Chrome.
This isn't a complete issue yet, I have some questions on the current behavior. Please help me out on how it currently works in the backend @PapaBravo @cnasenberg
How does the search currently work, based on the backend? Is it a geolocation search with a radius?
I think we should strive for the following (can be implemented in multiple features along the way):
When you hover your cursor over a store in the search view, it blackens. It's almost not readable.
Happens on mobile (Firefox, Chrome) and desktop (Safari). See screenshot: https://slack-imgs.com/?c=1&o1=ro&url=https%3A%2F%2Fpbs.twimg.com%2Fmedia%2FEUVZXG6WoAA9DwH.jpg
Add Analytics to storefront.
Blocked by Impressum + Privacy
We need a footer for showing privacy policies + imprint.
Additionally we could add add social media links.
Story
As a customer
I want to have more information about the products a small business offers
so I can buy the products when I contact the business owner
Acceptance Criteria
Technical hints
Story
As a customer
I want to have more information about the store I found in my Kiez
so I can establish an emotional bond and support it
Acceptance Criteria
Technical hints
Depending on the colour of the background images and on the browser (Safari is problematic), it can happen that the button in/at the profile image is barely recognizable.
Acceptance Criteria
Additional Info
Each CSS should use colors from material ui theme. Currently color values are duplicated.
Also p tags, or h* tags should be replaced by Typography components from material ui. Goal is that the theming works in a right way.
The contact icons on the store detail pages are too small to be properly used.
Their size should be increased so that they are easily touchable (i.e. the touch target area should be at least 9mm, see Google's web a11y guidelines).
Add react helmet to implement basic SEO
For quick solution we need:
The search currently says 'Ort' and 'Wähle einen Ort...'. It is not clear what the user should enter.
Acceptance Criteria
As we're using npm now, we have to add the package-lock.json
Have the search use URL parameters.
Once the customer inputs a search item and clicks search, the URL should contain the following path & parameters: /search?q=
This way we will be stateless and the search can be more dynamic
The website is currently running on plain HTTP. We should add a TLS certificate to it and redirect all requests to HTTPS.
A possible, low-cost solution is switching to a provider that provides TLS certificates automatically.
Right now the frontend has a hard configuration to talk to the prod backend:
baseUrl = 'https://dds-wvv-backend.herokuapp.com/';
let's make it configurable, so the baseURL is set via an env variable from Heroku
As a customer
When I enter the website
I want to see a welcome screen and a search for a store based on my zip code
So I don't have to look through a list and find a merchant close to me
Acceptance Criteria
Technical Suggestions
Check which License matches this project requirements and add a license then to the source code.
Story
As a customer
I want to support the small business I found in my Kiez
so the business won't go bankrupt
Acceptance criteria
https://www.figma.com/file/laA8ixWOGbkELaBrwDMOO9/SBH-Shop-Registration-Form?node-id=0%3A1
Implement Form with Material UI, Formik and Yup for the registration of shop owners.
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.