The idea behind this project is to list all other collaborative projects in a web app that is offline capable and is built using modern web platform features. A user can see a list of cards with details about all other collaborative projects under Udacity's Mobile Web Scholarship program. This list can be filtered/sorted based on categories and different features that the listed projects use. Users can see detailed info for projects by clicking on an individual card and see live experience as well.
We've decided to use MERN stack in our project. That means we'll be using Mongo, Express, React and Node to build our entire architecture. For the PWA related functionalities, we've decided to build the prod SW file with CRA itself but we've tried our best to separate those source files into Vanilla javascript modules so that anyone not familiar with React or CRA but have completed the full course can contribute easily to the project.
The best way to get started with contributing is to identify a feature, bug or module that is open for contributions. Non-code contributions are also counted. You can contribute by helping people on issues board (for ex. someone is having trouble setting the repository and running app or any other queries). For code style and commit guidelines please see CONTRIBUTING.md
A Design Guideline has been created for reference. Please refer to it while making changes in UI.
We are using Github labels to categorize issues and pull requests.
| Label | Description |
|---|---|
| bug | Something isn't working as expected. Probably implementation is wrong. |
| duplicate | This issue or pull request already exists |
| enhancement | New feature or request |
| good first issue | We know where the problem lies, we'll provide info in issue. But we think this is a good issue to work on if you are a new contributor and want to get started with the project |
| help wanted | We need to consult the community on this issue or we need help regarding this |
| open for claim | this issue is open for anyone who wants to contribute. note: if you want to claim the issue, please comment on it with brief details on how you'd want to approach the problem |
| invalid | This issue or PR doesn't seem right |
| question | This is a query, further information is requested |
| wontfix | We know this issue or feature request, but after consulting among all the Co-Moderators, we've decided not to implement this feature or take this path |
| PR: change requested | Some change is required before merging this PR |
| PR: confirm merge | PR is reviewed and ready to be merged |
| Nice to have | It is nice to have this feature, but we do not guarantee it yet. |
| Important | This is important to address |
| Urgent | This is urgent to address |
| Critical | This is critical to address |
Open folder you want to clone this repo into, then-
- Frontend
git clone https://github.com/UdacityMobileWebScholarship/showcase-app.gitcd showcase-app/clientyarn install- to install project dependenciesyarn start- to run development buildyarn build- to build prod releaseyarn test- Launches the test runner in the interactive watch mode
Note: the front end app is bootstrap using Create React App. You can find more details about architecture here. See Project Wiki Page.
- Backend //TODO: init proj and add docs
- Just run the development environment or production environment as usual with npm start and npm run build.
- Create your SCSS files with an extension .scss and start writing SASS e.g. Button.scss.
- While importing, use import './Button.css' (important since this is how it's done in CRA)
Note: We're ignoring *.css files by default because they will automatically be generated. So, if you try to add CSS files, you will not see them in the git status.
Divyam Rastogi |
Nabarun Pal |
Parth Shandilya |
Prabhanshu Attri |
Shubham Sharma |
Shashank Kumar |
Ritik Rishu |