I'm Arsad Rahman from India , More than 5 years experience as Software Engineer - Full stack native mobile application developer (Both Android , IOS) now working independent freelancing .

My Skills :

UI/UX - Sketch App(UI Designing), Figma and Marvel (Prototyping).
Frontend - Java & XML (Android App Development) , Swift (IOS App Development).
Middleware - Node.js with Express js , PHP Webservice - Restful API .
Backend – Firebase , MySQL, Mongodb, Parse.
Blockchain - IBM Hyperledger Fabric.
Multimedia – Adobe Photoshop, Premiere Pro and After Effect,Audacity.

Looking forward into contributing this project.

Hi, I think this project would benefit from a test-driven workflow, so i'm opening this issue for others to openly discuss any specific libraries/frameworks they would recommend to test code for this project.

Personally, I use Jest to unit test my Javascript (which is mainly JQuery) code at work. I know Jest or Jasmine aren't specific to a Javascript library whereas Enzyme is meant to be used with React. Both can be used together as well.

I would appreciate someone with more experience writing tests with React to chime in on this as my experience is limited! (going based off the assumption we will be using React on the front-end)

Some resources i've looked into:

• https://jestjs.io/
• https://jasmine.github.io/
• https://medium.com/codeclan/testing-react-with-jest-and-enzyme-20505fec4675
• https://testing-library.com/docs/react-testing-library/intro

This will involve localizing the components of the applicatoin be translation Ready and have support for many international languages. Recommended library for this is React-intl.
For more, see here

Since React requirement is locked down, may I suggest Gatsby?

Gatsby

• well funded with a large team
• solid MDX support (Markdown + React component; more newbie friendly than plain React)
• 50+ integrations with other CMSes, databases, 1-click hosting, etc.
• Constant updates

While Gatsby has a vs Next page, let me add my observation:

Next

• Smaller, more focused team
• feels more streamlined to me
• More cautious about releases

There is "Create React App", are there other React bootstraps we should look into?

Disclosure, Somehow I was added to Gatsby organization. Might be my mis-click, someone like me?? I think I might have submitted 1-2 doc PR fixes, but I'm not really that involved with the project.

The UI exists and emails get sent, but we still need text for the email.

Depends on #814

Once that is done, we should lock this down to the approved roles and confirm via Cypress tests

• As an owner I can cancel any event
• As an admin of a Chapter I can cancel any events in that Chapter
• As any other role, I cannot cancel events
• Sensible email content
• update the test for it

The main thing to check is that requests from unauthorised users fail, but it's also helpful to confirm that the UI reflects their role.

Test should account for developer typing logic, that stop canceling the event if there are no members in the event Reference #1517 (comment)
Test should account for the mutation deletion reference #1517 (comment)

#TODO later

Please add guidelines and requirements for contributors.

It would be a good idea to add in location to the project to facilitate ease of searching for users browsing for groups. This is not an exhaustive list just some quick ideas to get started with.

As a user:

• Have to ability to see groups filtered by a radius of the user's current location.
• Specify the location to filter on and use the same radius filter.
• Potentially display markers on a map or list the groups within the filter radius.
• link to navigation on portable devices (optional)

As an organizer:

• As the event's address is entered, geocode the address and store the coordinates.

Postgresql does support geospatial datatypes here.

I think to better communicate and more easily build an API and UI, we need to come up with a uniform set of terminology. Below is my (very much changable) suggestion based on what I've heard the community say the most:

• A "chapter" "collective" is one singular instance/deployment of Chapter
  For example, Women who Code at the domain chapter.womenwhocode.com
• A "user" is a person who authed to the chapter
  For example, Kognise
• A "group" "chapter" is a container for events, with a description and subscribers, and one or more "admins" who can manage it
  For example, Women who Code NYC
• A "event" is a single meetup that users can RSVP to, has a specific location and time, and has "organizers"
  For example, Women who Code NYC April Meetup

(All the examples here are fictional and meaningless and probably super inaccurate)

What do you guys think of these - could they made more clear? Am I missing anything?

Hello,
are you people consider using a database migration tool? Particularly I found them very useful for apply database patches and preventing losing data. Have you considered any tool? I did a little research and found db-migrate for Node.js:

https://www.npmjs.com/package/db-migrate

Do you have any suggestions?

I think it's important to consider the needs and desires of the people who are going to install and maintain Chapter. I'll start with a few suggestions:

As an admin

• I want easy installation to the cloud or my own server
• I want to easily upgrade or update my instances without losing my data.
• I want to easily control which features are available to my users

An event should be visible when searching on Google or other search engines.
For this, we can add SEO compliant schemas to events such as -
https://schema.org/Event. Apart from this what are other needed SEO requirements ?

This will make it easier for a user to filter the chapters by interests, i.e. sports, events. Since the current schema has description and details, a more general “category” will make it easier to find the right chapter. If the chapter wants to be a private one, a private option will be added and won’t be able to be found by filtering by category.

Solution: Add category to existing chapter table schema.

RSS feeds would be invaluable, especially if they could be constructed from tags or categories. So I could subscribe to all of the events, or just events tagged with php. This could also be used to feed other Chapter sites.

Hi all, as a Data Engineer, I believe Analytics are important to optimising and improving the features of any app - Even if it's open source. For this instance, I'd like to start discussing the possibility of adding these after an MVP has been implemented.

To protect the safety and privacy of our users, we will not gather personal data: IP Addresses, Latitude/Longitudes, etc.

We could tracking the following:

• Date joined
• Cohort
• Country (Which would come from location and/or venue)
• Events attended (This can be calculated from rsvps, events)
• Browser type & version (Happy to remove them as well)
• Sponsor activity and engagement by venue
• Social engagement by venue

NOTE: All tracking options would be Opt-In and customisable. This means we would NOT track anything without consent from a user, under any circumstances.

As a user I would like to be able to search for meetups near me, meetups based on my preferences, and upcoming meetups.

User Story
[ ] Design Schema
[ ] Implement architecture to handle scale(load balancer, containerization using Docker and Kubernetes)
[ ] Implement Search Functionality
[ ] Performance testing

Below is a basic documentation outline. Please feel free to add your feedback.

Getting Started as an Organizer

• Installing Chapter
• Create an organizer account
• How Chapter works

Using Chapter

• Creating and managing events
• Chapter and member communications
• Chapter settings
• Manage Members
• Group and event photos
• Member guide
• Sharing events

Account & Notifications

• Accessing an account
• Resetting your password
• Organizer subscriptions
• Notification settings

Technical Issues

• What browsers does Chapter support?
• Why am I not receiving emails?
• Why can't I upload a photo?

Policies and Community Guidelines

• Community guidelines
  • Privacy policy
  • Report a member
  • Report a group

Backend/Architecture

• API docs

Currently ES is listed in the tech stack. ES is a great tool and it's absolutely best in class for it's purpose of enabling powerful search, but as someone who has maintained a whole mess of ES clusters, it also comes with a lot of cost and complexity.

ES requires multiple nodes, it's authentication mechanisms are expensive and require enterprise licensing and there are limited SAAS hosts available. In addition, it adds significant hosting complexity (shard rebalances, kibana hosting, etc) and makes development and tests very complex, even with Docker.

If one of the goals of chapter is to be easy and free-ish for small orgs to host, then ES shouldn't be a hard requirement. It can be an upgrade to enable more powerful search for dedicated hosts, but we shouldn't design against ES as a requirement. There are several other ways to enable meaningfully powerful search, including a solid full text search capability in Postgres.

We can lower the development cliff to be involved significantly, and help enable small scale hosting of instances dramatically by leveraging alternatives, without compromising MVP features.

Why wouldn't we reconsider dropping TS. For this size I think it would that VS Code (and other editos) tooling with TS outweighs any downsides.

Forgive me if it has been answered somewhere, but I can’t seem to find it, but how are we going to link these meetup.com-in-a-boxes together to find events across different interests and organizations?

An aggregator microservice?
A directory page like github /awesome?
An elasticsearch server hosted by freecodecamp powered by donations?

The reason why meetup.com succeeds is because of network effects (as mentioned in the medium article), but if each chapter is an isolated db, network effects don’t happen.

Would anyone be interested in attempting to use Next.js to build a rough prototype of this application? I've read a lot of good things about Next.js, but ultimately we will see whether it's a good fit when someone digs into it and builds out some of the core routes.

Hello team,

Please use this issue to add your ideas for future releases of Chapter. (e.g. Push notifications)

• User can add RSVP's to a supported calendar app. Refer to this tool. See examples.
• I can filter events by date
• I can filter events by tags (via #117)
• As a user, I should be able to indicate "No", that I will not be attending an event (via #125 & #53)
• The user can save a Chapter's events before joining
• The user should also receive the email reminder about their upcoming event. (via #10)
• The Chapter organizer can reach out to the anonymous user should they choose.
• As a future participant when I click one of those locations, I can see the "show view" for that event's group, with details about the upcoming event, along with a button to RSVP.
• Users can log in with other social logins such as Facebook/Github/Twitter/...
• As an organizer I can send private invites to join your Chapter to users or non-users via e-mail.
• As an organizer I can check-in attendees on the event registration desk with their email_id or chapter_id
• As an organizer, I can set a sponsor description (via #127)
• An user can opt to sponsor an event with a "Sponsor Now" or "Be a Sponsor"
• When electing to sponsor an event, the application will detect if they are a registered user, if not, they will be prompted to (optionally) create an account.
• As an organizer, I would like search engine optimization to advertise my chapter and events. (via #67)
• a provision for past events listings on the Chapter page as suggested by https://github.com/mnttnm
• a provision for "Share an Event" kind of functionality as suggested by https://github.com/mnttnm

I think it would be beneficial to add a tag id column to the events table and add tags table, so we can add filters for specific tags. For example, if I'm interested in attending meetups for JavaScript, eSports, and hiking, I want to be able to filter all events for these specific tags and return those results.

We can simplify and smooth the auth system a lot by using something like passwordless, any thoughts on this?

Problem

Without a standardized way of merging pull requests, this repository's commit history a bit of a mess.

The "Add swagger json" pull request (#46) implements a single feature (👍 ) but was merged as five identically-described commits (👎):

Looking at this history, I have no idea what was implemented here. The commits should have been squashed into a single commit like "Add swagger json (#46)".

Work-in-progress commits are helpful when working on a feature branch, but they aren’t necessarily important to retain in the Git history. If you squash these commits into one commit while merging to the default branch, you can retain the original changes with a clear Git history.

Solution

Enforce "squash merging" for pull requests

For commits to the master branch, I only care about what features were implemented - and not the commits it took to get there. This will make the commit history much cleaner, and greatly simplify the rollback/revert process.

Proposal

Simply asking people to squash pull requests may not be sufficient, we should disable "merge commits" and "rebase merging" in the repository's settings page - requiring all commits to the master branch be squashed.

This needs UI and resolvers to handle the requests. The DB schema has user_bans already, so a given user can be banned from a specific Chapter.

Until #814 is in, we can make some progress by implementing the UI for banning users and a resolver to update the DB. After the auth PR is in, we'll need to consider if 'banned' becomes a role that denies you access or if we need to handle banned user access differently.

• As an owner I can ban anyone except other owners
• As an admin of a Chapter I can ban anyone in a Chapter except other admins
• As any other role, I cannot ban anyone

The main thing to check is that requests from unauthorised users fail, but it's also helpful to confirm that the UI reflects their role.

We will also need tests to confirm that banned users can no longer interact with Chapters they are banned from.

Fullstack dev. from Bangalore, India. Work on React, Postgres, Node, dangling a bit with Docker, K8s, Monitoring lately. Hope to contribute and learn. Godspeed!

Wanted to throw this in now. I think that once we land on some decisions re: frameworks, we should publish a best practices that this repo wants to follow. It will help people like me who have not contributed to open source yet jump on board and have some clear boundaries. Also, it can morph over time as we discuss changes.

Below I'll try to assemble a checklist of things we have to get done before shipping a semi-stable beta that's close to a finished product.

As I see it so far:

• Sort Out Additional Tech Stack Decisions #24 #34 #145 #76 #32
• Determine Web Browser Support #144
• Sort out Authentication #40 #33
• Finalize an API #17 #46 #257 #120 #253
• UI/UX mockups #114
• Add Initial Documentation to Wiki #12
• Build super basic MVP based on the MVP Project Board

This is vastly simplified, maybe we eventually want to move to a task management solution? Anyways, I'd love feedback on what this is missing. I tried to link up some issues/PRs but I'm probably missing a lot.

I think we should discuss whether to use full native solution (Kotlin/Swift) or try Flutter for making apps. Personally, I do not think Ionic or other platforms relying on C# or JS are good for this project.

Implementation details:

• The DB already has event_sponsors and sponsors tables
• We need a resolver and client GraphQL queries to access the data
• On /events/[id] we'd need basic UI which just has a link on the event page. That's enough to move forward
• /dashboard/events/[id]/edit would need an input element to select a sponsor

Since there's been a fair amount of discussion surrounding the sponsor types, we should track those details in a separate issue before closing this. However, I do think the above implementation would be a solid start.

I am opening this issue for us to discuss the possibility of using docker-compose for the development of this project. This I think will make onboarding easier.

In an effort to consolidate discussion, what tech stack should we use for the back-end? Front-end? Database? REST or GraphQL? Any services we should leverage? Should we use a monorepo?

I've had great success with NestJS as a backend framework (it's based off Node) and would suggest we use that.

Discuss your ideas or share your views:

This issue has been created to house the desired MVP user stories. Please think big picture items as we are trying to roll out an MVP very quickly. There are so many great ideas that the community has voiced - let's make it easy to isolate the ones that we deem pertinent to the initial release of the app.

I've listed the ones detailed in the README below, as they seem like a good start.

As a future participant

• I can use a search box on the landing page to input a city, state, or country name and it will autocomplete. I can click one of those locations.
• When I click one of those locations, I can see the "show view" for that event's group, with details about the upcoming event, along with a button to RSVP.
• I can click the "RSVP" button. When I do, I will be prompted to sign in. Then I will receive an email with a ticket and add me to the public list of event attendees.
• I can cancel the "RSVP".
• I will receive a second email the day before the event to remind me.
• After the event, I will automatically get emails notifying me of subsequent events.

As an organizer:

• I can create a chapter.
• I can edit details about the chapter, including a Slack/Discord/Facebook/WeChat/WhatsApp link participants can join to discuss and coordinate events.
• I can add a chapter or organization logo.
• I can create events, and set their location and capacity.
• I can view the RSVP count
• I can cancel events.
• I can email the entire list of participants.
• I can ban a participant whom I believe is toxic or who has previously broken my organization's code of conduct.
• I can add a venue sponsor to the event with a link to their website as a way of thanking them for hosting.
• I can add a food sponsor to the event with a link to their website as a way of thanking them for food.
• I can see how many times a participant has come to the event as well as their attendance rate
• I can check-in attendees on the event registration desk with their email_id or chapter_id

As a user I would like to arrive at a fast loading page where I can login and see other meetups

User Story:
[ ] Implement pixel perfect match for web based on wireframe provided by UX tteam
[ ] Allow user to either sign up or login
[ ] Explore feature where one can search meetups based on location

From a UX perspective, we probably want to make the experience for users who just want to RSVP to events as streamlined and possible. One thing that imo should be considered is user account management. With the current design, users have to create and manage separate accounts across all Chapter instances they're signed up to. This could get tedious.

I think we should have a conversation about possible solutions to this, I'm not very experienced with decentralization in general but I think we could implement some sort of SSO. This would also enable syncing user account details and interests across instances.

One network that solves this exceptionally well is Stack Exchange - we could look into how they do this. I haven't done a lot of research but I think they use something OpenID-related.

I'm open to learn new things!

Why? this project aims to be a replacement for meetup.com, that's mean the target arent just big/small group of developers. Fastify is mature now and it got express like syntax. Since the backend project would be an HTTP API why not choose the fastest mature framework?

Fastify

Benefit:

• The learning curve from express arent that high
• Speed improvement on HTTP request
• There are oauth2 module too now

Cons:

• If you plan to use auth library like passport.js it cant work with Fastify.
• If you plan to use WebSocket Socket.io aren't good choice it sometimes break with Fastify

on auth, I usually use oauth2 module on WebSockets I can help develop with ws, primus, or faye module but I don't see any use case on WebSocket with this project.

Express

Benefit:

• Many people already know, so many resources when encounter an error
• So many plugins! 😄

Cons:

• Much slower than Fastify
• (I don't see any cons of using express)

That's it!

Description:

There was a change in terminology. "Groups" are now called "chapters". The change is reflected in API and DB schema, but docs are outdated.

Discussion in #71

These are a few things that I haven’t seen talked about yet. Have these things been considered?

If we can go to a paid option new relic will take care of most of these things if we use a free option There are several good options. We can use terraform to create policies and alerts, as well as the creation of resources (ie: pg clusters, elastic)
If these things have already been hammered out that is great, else I’m more than happy to go into more detail and map out what I think needs to be done as far as infrastructure.

Keeping accessibility in mind

As we are creating a new application that brings together a variety of people without a paywall cough Wework cough, we need to keep accessibility in mind. Having the application being at least AA WCAG 2.1 compliant would ensure we can at least reach users with some level of visual or physical impairment. By adding minimal tweaks here and there, we can reach more by removing barriers to the platform, hence "accessibility".

Accessibility is the law now - Quincy Larson

Since FCC is not owned or used federally, we can skip Section 508 but I added it below for reference if anyone is interested in seeing where it all started. If anyone has additional ideas on implementation or other helpful comments, please do share and feel free to make changes as needed.

A Practical Approach

Web Accessibility does not get enough coverage in CS or Web Dev courses, but it makes a huge difference for a lot of users online. - Roman Mikhailov

• Color Contrast: Run your color palette through Toolness Accessible Color Matrix or Web Aim Color Contrast Checker. You'll learn that white text on a yellow background won't cut it.
• Use Semantic markup: use HTML5 tags as they were intended (not using <h1> for it's size or <div> where <section>,<article> or <footer> would be appropiate), use CSS for the rest
• Screen readers: Use an actual screen reader like NVDA for Windows or VoiceOver for Mac alongside ChromeLens to mimic the experience of a person with visual impairments and see if you can still find what you need
• Aria Labels, tooltips, titles, and alt properties: making sure important content is not lost if images don't load, ensure the form input fields have proper aria roles, and let users know that a dialog box or modal has been opened and how to close it
• Navigable Forms: For keyboard-heavy/only users, forms should follow a logical tab order and should display appropriate feedback if values are missing or entered incorrectly.
• Skip to Content button: avoids the user having to listen to every dropdown option in the navigation when using a screen reader
• Zoom: Some users need to enlarge content, make sure things don't fall to pieces when they do
• CPU Throttling: One mistake devs often make is developing Frontend heavy sites on super fast computers, completely oblivious to the fact that their site is hanging on entry level laptops. Use chrome to throttle cpu and test performance. - @wellpaidgeek
• Font size: 16px is the web standard. Let's save the light grey 10px font on a white background for things we intentionally don't want users to see

Tools

a11y Quick Tests
Axe Accessibility Chrome extension
Function Accessibility Evaluator
Toolness Accessible Color Matrix
Web Aim Color Contrast Checker
ChromeLens chrome extension - seeing through another's eyes
About Screen Readers: Narrator, AudioVox, NVDA, JAWS - prepare to be overwhelmed

References

Overview (with videos)
Top Questions about Accessibility
W3 Developing Tips
Google Overview on Design and UX - specifically ARIA labels
WCAG Quick Reference
Quick tips using manual testing

Extra

Section 508 amendment details

Implementation details:

• UI: /dashboard/events will need buttons to email all subscribed users after a confirm dialog has been clicked through
• Sending the email: we already have a sendEventInvite mutation

  chapter/server/controllers/Events/resolver.ts

  Line 259 in 8ef1db3

  async sendEventInvite(@Arg('id', () => Int) id: number) {

• It should be possible to reuse most of that, but allow the emails sent to vary.

Whilst I like the image of the schema, it's not auto-generated on updates to the SQL script so it could be misleading.

The version there is generated by a tool called DataGrip from JetBrains which is not free.

As a user after logging in I would like the ability to see a customized feed based on my interests, and past meetup history

User Stories
[ ] Pixel perfect landing page based on ux wireframes
[ ] Create section to view events that I am attending or groups that I am a part of
[ ] Create section to explore groups related to my interests by querying recommendation microservice

As per finalised tech stack frontend will be "React using JavaScript (not TypeScript) and CSS (not Sass)"

Would like to discuss on which packages/libraries are best suited with react echo system ?

Will use any boilerplate ?

1. create-react-app
2. https://github.com/react-boilerplate/react-boilerplate

These two almost provides readymade support for transpiring and bundling and makes app production ready from day one.

Other useful packages I would like to add:

1. Reselect : Provides memoization and avoids wasted renders. More
2. Redux: App state management
3. Redux-saga : For asynchronous call, uses generators and provides some good features like take_latest. Check Redux-saga and redux-thunk-vs-redux-saga
4. React-intl: Refer #21

Would like to hear community thoughts and experience with this and any other useful packages, we can include in frontend tech stack

As a user I would like to see a clean landing page when arriving to the site

User Story:

[ ] Logo
[ ] Decide on color palette
[ ] Spike - Think about potential accessibility issues
[ ] Wireframe

Continuing the conversation from Discord!

As a user I would like to be reminded of events that I signed up to when they are coming up

User Story:
[ ] Spike research smtp or other service that we can use
[ ] Implement bot that would search through all of the current upcoming meetups and alert each member ** think of scale....
[ ] Implement unsubscribe feature in the case that a user no longer wants these emails