mattruddy/store-ui

PWA Store - largest store for uploading and discovering Progressive Web Apps

Matt Ruddy

Software Development Engineer at TrialSpark and Freelance developer.

My Projects

Click images to view live site

Referican *I do not own this app but did build it	Historic Borders
Built an application for connecting FAANG employees with potential candidates. Referican is a full fledge social media platform with real time chat, job posting feed, rating system and company verification. It's an unbios way to refer candidates as the names are hashed and private until the resume handoff.	Engineered a map for viewing country borders throughout history. Integrated with Mapbox and React Globe. Over 100 stars on Github. 29k Upvotes on Reddit. Currently working on migrating this over to Blitz.js to allow users to sign up and edit the map.
Snipdown	DeArt
Serverless application which links with your github allowing you to create gists in a markdown editor. They can then be shared via a sharable link or exported as a PNG / SVG file.	Developed a Full-Stack decentralized application which uses a deployed ERC721 smart contract to create NFT’s which store image files in webP format. It's a cool idea until you actually create the NFT and realized how expensive transactions are on the ethereum network.

store-ui's Issues

App of the day

Use horizontal overflow for screen shots

use the overflow we are using on the apps on the home page for the screen shots instead of the slides

react helmet integration

• add helmet for dynamic headers
• might require gatsby for server side rendering

Add dev analytics

Onboard Matt

• discord
• dev.to
• github
• clockify
• set up dev environment

Sign In w/ GitHub transition to profile lag

2.5 Issues

• Title color on light mode needs to be darker
• Dev comment should link to page

Workbox inject manifest

will be very helpful for adding push notifications.

Add Built in Lighthouse Report on Submit Modal

Categories on the left [Desktop]

add an about developer section.

Add Education and Employment to profile

• add in settings
• add to public profile

Password Regex on login

• show user the terms for a pw: One Capital, 8 chars min, one number and one special char

Add wiki for setting up prettier

Simple notifications

Add simple notifications to the store

interface Notification {
  subject: string
  body?: string
  link?: string
  isRead: boolean
  isArchived: boolean
}

SEO

Integrate Redux

Toast When SW update is available

blocked by #25

Add Header Description to login/signup page

Show the user why they would they want to sign up. Currently an average user could get confused and think that need to sign up when only developers should need to sign up

Improve search functionality

• bring up search but still show content until type search
• show loading spinner
• show if no results are returned

Developer Page and Profile Edit

Developer Page

• Username

• Icon (Profile Pic)

• Social Links Section (Preset sections: Facebook, Github, Twitter, Linkedin...)

• Listing all their apps

• Favorite tech list (tech tag {key: id, name: string, link: url}, auto complete)

• Media Links (A space to put anything: Media links, Motto, html field)

• Awards (later)

• Is Moderator (later)

• Public /dev to get developer details

• Public Developer Detail Page

• Extend /profile to have editable sections above

Fix Splash Screen

Create newsletter toast

Add Feature section

• Order of home should be Featured, Discover, and Top
• new page /admin-feature
• Have app search in admin that can mark an app as featured
• clear all featured in admin
• list all featured in admin
• submit button in admin

Add install button

https://web.dev/customize-install/

clean up styling of the developer page

Future Plans

• Allow developer to request to become a moderator
• Create Moderator Page showing pending apps
• Application Module with Linkden link
• Peer reviewed system
• Community of devs for devs
• Developer (public developer page)

Developer Page

• Username

• Icon (Profile Pic)

• Social Links Section (Preset sections: Facebook, Github, Twitter, Linkedin...)

• Listing all their apps

• Favorite tech list (tech tag {key: id, name: string, link: url}, auto complete)

• Media Links (A space to put anything: Media links, Motto, html field)

• Awards (later)

• Is Moderator (later)

• Public /dev to get developer details

• Public Developer Detail Page

• Extend /profile to have editable sections above

Rebranding

The number one platform for learn, discovering, building PWAs

Moderator

To incentivize and to moderate the platform

• Sync with discord API
  • permissions
  • roles
• social benefits

Point System

• Content Creation
• Voting and adding feedback on apps
• Publishing apps

Monetization?

• Stripe

• Optional

• API

• Companies paying for more detailed info on developers that are creating apps with a specific tech stacks

  • feedback
  • their apps
  • reviews
  • installs

• Help sponsors find developers

  • change sponsors

Highlight category

Create server side meta rendering api

https://www.youtube.com/watch?v=xTsYYxf2Ut0&t=0s

In this video Ben talks about redirecting bot user agents to a special html file for properly loading open graph data.

[IMPORTANT] Support For Landscape ScreenShots

Add ga events

• Add event for install button
• Add event for comments

PWA Store

Add dark mode

Now that redux is implemented, should be easy to add a State

Improve search function

Currently the search only searches by the first couple of letters of app's name

• search results search on all letters in an app name
• search results use tags?

Better Page Animations

"Invalid Date" in Safari

Add Tech stack

• Backend already there
• add tech stack tags to the settings
  • have a tag input box that can search for tags already created while the user types
• filter on tech stack tags in the search for devs
• add tags to the public profile

Filter homepage (Stars, update date, ect.)

Add tags for searching apps

Apps should be able to add up to 5 tags that describe it so when a user searches for example "card games", "Yahtzee" would show up

• tags field to app submit
• tags field to edit app
• use an auto suggestion box for the tags
• show tags on app detail

Too Many DOM updates on home page scroll

this is cause a jittery scroll

Allow for all apps to be uploaded

• Mark duclicates in admin
• only show duclicates in search (not in any queries)
• make sure they show for the devs profile

Add focus to search bar when search is pressed

Better Screenshot View

feedback from others shows the current drag is unintuitive