diff --git a/Projects/Voting-App.md b/Projects/Voting-App.md new file mode 100644 index 00000000..ae40b9b0 --- /dev/null +++ b/Projects/Voting-App.md @@ -0,0 +1,24 @@ +# Voting App + +**Tier:** 2-Intermediate + +Allow users to vote give multiple choices + +## User Stories + +- [ ] User can see a list of items he can vote on +- [ ] These items must have a button that the user can click on to vote +- [ ] After the user clicked a button, the user should see all the votes + +## Bonus features + +- [ ] Store items and votes in a database +- [ ] Only allow authenticated users to vote + +## Useful links and resources + +- [Firebase](https://firebase.google.com) for a realtime database + +## Example projects + +- [Voting App by Florin Pop on Codepen](https://codepen.io/FlorinPop17/full/NWKQWmq) diff --git a/README.md b/README.md index 470245db..1399c8af 100644 --- a/README.md +++ b/README.md @@ -9,11 +9,11 @@ authors sometimes have "writers block" it's also true for developers. This list These applications are: -- great for improving your coding skills :muscle:; -- great for experimenting with new technologies 🆕; -- great for adding to your portfolio to impress your next employer/client :file_folder:; -- great for using as examples in tutorials (articles or videos) :page_with_curl:; -- easy to complete and also easily extendable with new features :ok_hand:; +- great for improving your coding skills :muscle:; +- great for experimenting with new technologies 🆕; +- great for adding to your portfolio to impress your next employer/client :file_folder:; +- great for using as examples in tutorials (articles or videos) :page_with_curl:; +- easy to complete and also easily extendable with new features :ok_hand:; This is not just a simple list of projects, but a collection that describes each project in enough detail so that you can develop it from the ground up! @@ -39,65 +39,66 @@ required to complete them. ### Tier-1: Beginner Projects -| Name | Short Description | Tier | -| ---------------------------------------------------------------------- | --------------------------------------------------------- | ---------- | -| [Bin2Dec](./Projects/Bin2Dec-App.md) | Binary-to-Decimal number converter | 1-Beginner | -| [Border Radius Previewer](./Projects/Border-Radius-Previewer.md) | Preview how CSS3 border-radius values affect an element | 1-Beginner | -| [Calculator](./Projects/Calculator-App.md) | Calculator | 1-Beginner | -| [Christmas Lights](./Projects/Christmas-Lights-App.md) | Simulate a string of Christmas lights | 1-Beginner | -| [Cause Effect App](./Projects/Cause-Effect-App.md) | Click list item to display item details | 1-Beginner | -| [Color Cycle](./Projects/Color-Cycle-App.md) | Cycle a color value through incremental changes | 1-Beginner | -| [Countdown Timer](./Projects/Countdown-Timer-App.md) | Event Countdown timer | 1-Beginner | -| [CSV2JSON App](./Projects/CSV2JSON-App.md) | CSV to JSON converter | 1-Beginner | -| [Dynamic CSS Variables](./Projects/Dynamic-CSSVar-app.md) | Dynamically change CSS variable settings | 1-Beginner | -| [First DB App](./Projects/First-DB-App.md) | Your first Database app! | 1-Beginner | -| [Flip Image](./Projects/Flip-Image-App.md) | Change the orientation of images across two axes | 1-Beginner | -| [GitHub Status](./Projects/GitHub-Status-App.md) | Display Current GitHub Status | 1-Beginner | -| [Hello](./Projects/Hello-App.md) | User native language greeting | 1-Beginner | -| [IOT Mailbox Simulator](./Projects/IOT-Mailbox-App.md) | Use callbacks to check your snail mail | 1-Beginner | -| [JSON2CSV App](./Projects/JSON2CSV-App.md) | JSON to CSV converter | 1-Beginner | -| [Key Value](./Projects/Key-Value-App.md) | Keyboard Event Values | 1-Beginner | -| [Lorem Ipsum Generator](./Projects/Lorem-Ipsum-Generator.md) | Generate lorem ipsum placeholder text | 1-Beginner | -| [Notes App](./Projects/Notes-App.md) | Create an online note pad | 1-Beginner | -| [Pearson Regression](./Projects/Pearson-Regression-App.md) | Calculate the correlation coefficient for two sets of data | 1-Beginner | -| [Pomodoro Clock](./Projects/Pomodoro-Clock.md) | Task timer to aid personal productivity | 1-Beginner | -| [:star2: Product Landing Page](./Projects/Product-Landing-Page.md) | Showcase product details for possible buyers | 1-Beginner | -| [Quiz App](./Projects/Quiz-App.md) | Test your knowledge by answering questions | 1-Beginner | -| [Recipe App](./Projects/Recipe-App.md) | Recipe | 1-Beginner | -| [Roman to Decimal Converter](./Projects/Roman-to-Decimal-Converter.md) | Convert Roman to Decimal numbers | 1-Beginner | -| [Slider Design](./Projects/Slider-Design.md) | Display images using a slider control | 1-Beginner | -| [Stopwatch App](./Projects/Stopwatch-App.md) | Count time spent on activities | 1-Beginner | -| [TrueOrFalse](./Projects/True-or-False-App.md) | Identify the result of a conditional comparison | 1-Beginner | -| [Vigenere Cipher](./Projects/Vigenere-Cipher.md) | Encrypt text using the Vigenere Cypher | 1-Beginner | -| [Wind Chill](./Projects/Windchill-App.md) | Calculate the windchill factor from an actual temperature | 1-Beginner | -| [Word Frequency](./Projects/Word-Frequency-App.md) | Calculate word frequency in a block of text | 1-Beginner | +| Name | Short Description | Tier | +| ---------------------------------------------------------------------- | ---------------------------------------------------------- | ---------- | +| [Bin2Dec](./Projects/Bin2Dec-App.md) | Binary-to-Decimal number converter | 1-Beginner | +| [Border Radius Previewer](./Projects/Border-Radius-Previewer.md) | Preview how CSS3 border-radius values affect an element | 1-Beginner | +| [Calculator](./Projects/Calculator-App.md) | Calculator | 1-Beginner | +| [Christmas Lights](./Projects/Christmas-Lights-App.md) | Simulate a string of Christmas lights | 1-Beginner | +| [Cause Effect App](./Projects/Cause-Effect-App.md) | Click list item to display item details | 1-Beginner | +| [Color Cycle](./Projects/Color-Cycle-App.md) | Cycle a color value through incremental changes | 1-Beginner | +| [Countdown Timer](./Projects/Countdown-Timer-App.md) | Event Countdown timer | 1-Beginner | +| [CSV2JSON App](./Projects/CSV2JSON-App.md) | CSV to JSON converter | 1-Beginner | +| [Dynamic CSS Variables](./Projects/Dynamic-CSSVar-app.md) | Dynamically change CSS variable settings | 1-Beginner | +| [First DB App](./Projects/First-DB-App.md) | Your first Database app! | 1-Beginner | +| [Flip Image](./Projects/Flip-Image-App.md) | Change the orientation of images across two axes | 1-Beginner | +| [GitHub Status](./Projects/GitHub-Status-App.md) | Display Current GitHub Status | 1-Beginner | +| [Hello](./Projects/Hello-App.md) | User native language greeting | 1-Beginner | +| [IOT Mailbox Simulator](./Projects/IOT-Mailbox-App.md) | Use callbacks to check your snail mail | 1-Beginner | +| [JSON2CSV App](./Projects/JSON2CSV-App.md) | JSON to CSV converter | 1-Beginner | +| [Key Value](./Projects/Key-Value-App.md) | Keyboard Event Values | 1-Beginner | +| [Lorem Ipsum Generator](./Projects/Lorem-Ipsum-Generator.md) | Generate lorem ipsum placeholder text | 1-Beginner | +| [Notes App](./Projects/Notes-App.md) | Create an online note pad | 1-Beginner | +| [Pearson Regression](./Projects/Pearson-Regression-App.md) | Calculate the correlation coefficient for two sets of data | 1-Beginner | +| [Pomodoro Clock](./Projects/Pomodoro-Clock.md) | Task timer to aid personal productivity | 1-Beginner | +| [:star2: Product Landing Page](./Projects/Product-Landing-Page.md) | Showcase product details for possible buyers | 1-Beginner | +| [Quiz App](./Projects/Quiz-App.md) | Test your knowledge by answering questions | 1-Beginner | +| [Recipe App](./Projects/Recipe-App.md) | Recipe | 1-Beginner | +| [Roman to Decimal Converter](./Projects/Roman-to-Decimal-Converter.md) | Convert Roman to Decimal numbers | 1-Beginner | +| [Slider Design](./Projects/Slider-Design.md) | Display images using a slider control | 1-Beginner | +| [Stopwatch App](./Projects/Stopwatch-App.md) | Count time spent on activities | 1-Beginner | +| [TrueOrFalse](./Projects/True-or-False-App.md) | Identify the result of a conditional comparison | 1-Beginner | +| [Vigenere Cipher](./Projects/Vigenere-Cipher.md) | Encrypt text using the Vigenere Cypher | 1-Beginner | +| [Wind Chill](./Projects/Windchill-App.md) | Calculate the windchill factor from an actual temperature | 1-Beginner | +| [Word Frequency](./Projects/Word-Frequency-App.md) | Calculate word frequency in a block of text | 1-Beginner | ### Tier-2: Intermediate Projects | Name | Short Description | Tier | | ------------------------------------------------------------------ | -------------------------------------------------- | -------------- | -| [Bit Masks](./Projects/Bit-Masks-App.md) | Using Bit Masks for Conditions | 2-Intermediate | +| [Bit Masks](./Projects/Bit-Masks-App.md) | Using Bit Masks for Conditions | 2-Intermediate | | [Book Finder App](./Projects/Book-Finder-App.md) | Search for books by multiple criteria | 2-Intermediate | | [Card Memory Game](./Projects/Card-Memory-Game.md) | Memorize and match hidden images | 2-Intermediate | -| [Charity Finder App](./Projects/Charity-Finder-App.md) | Find a Global Charity to donate to | 2-Intermediate | -| [Drawing App](./Projects/Drawing-App.md) | Create digital artwork on the web | 2-Intermediate | -| [Emoji Translator App](./Projects/Emoji-Translator-App.md) | Translate sentences into Emoji | 2-Intermediate | +| [Charity Finder App](./Projects/Charity-Finder-App.md) | Find a Global Charity to donate to | 2-Intermediate | +| [Drawing App](./Projects/Drawing-App.md) | Create digital artwork on the web | 2-Intermediate | +| [Emoji Translator App](./Projects/Emoji-Translator-App.md) | Translate sentences into Emoji | 2-Intermediate | | [Flashcards App](./Projects/FlashCards-App.md) | Review and test your knowledge through Flash Cards | 2-Intermediate | | [Flip Art App](./Projects/Flip-Art-App.md) | Animate a set of images | 2-Intermediate | | [HighStriker Game](./Projects/HighStriker-Game.md) | Highstriker strongman carnival game | 2-Intermediate | | [Markdown Previewer](./Projects/Markdown-Previewer.md) | Preview text formatted in GitHub flavored markdown | 2-Intermediate | | [Markdown Table Generator](./Projects/Markdown-Table-Generator.md) | Convert a table into Markdown-formatted text | 2-Intermediate | | [Meme Generator App](./Projects/Meme-Generator-App.md) | Create custom memes | 2-Intermediate | -| [Podcast Directory](./Projects/Podcast-Directory-App.md) | Directory of favorite podcasts | 2-Intermediate | -| [QR Code Badge Generator](./Projects/QRCode-Badge-App.md) | Encode badge info in a QRcode | 2-Intermediate | +| [Podcast Directory](./Projects/Podcast-Directory-App.md) | Directory of favorite podcasts | 2-Intermediate | +| [QR Code Badge Generator](./Projects/QRCode-Badge-App.md) | Encode badge info in a QRcode | 2-Intermediate | | [Regular Expression Helper](./Projects/RegExp-Helper-App.md) | Test Regular Expressions | 2-Intermediate | | [Sales Reciepts App](./Projects/Sales-DB-App.md) | Record Sales Receipts in a DB | 2-Intermediate | -| [Simple Online Store](./Projects/Simple-Online-Store.md) | Simple Online Store | 2-Intermediate | +| [Simple Online Store](./Projects/Simple-Online-Store.md) | Simple Online Store | 2-Intermediate | | [Sports Bracket Generator](./Projects/Sports-Bracket-Generator.md) | Generate a sports bracket diagram | 2-Intermediate | | [String Art](./Projects/String-Art.md) | An animation of moving, colored strings | 2-Intermediate | | [Timezone Slackbot](./Projects/Timezone-Slackbot.md) | Display Team Timezones | 2-Intermediate | | [To-Do App](./Projects/To-Do-App.md) | Manage personal to-do tasks | 2-Intermediate | | [Typing Practice](./Projects/Typing-Practice-App.md) | Typing Practice | 2-Intermediate | +| [Voting App](./Projects/Voting-App.md) | Voting App | 2-Intermediate | ### Tier-3: Advanced Projects @@ -105,19 +106,19 @@ required to complete them. | -------------------------------------------------------------- | ------------------------------------------------------------------- | ---------- | | [Battleship Bot](./Projects/Battleship-Bot.md) | Create a Discord bot that plays Battleship | 3-Advanced | | [Battleship Game Engine](./Projects/Battleship-Game-Engine.md) | Create a callable engine to play the Battleship game | 3-Advanced | -| [Boole Bots Game](./Projects/Boole-Bot-Game.md) | Battling Bots driven by Boolean algebra | 3-Advanced | -| [Calorie Counter](./Projects/Calorie-Counter-App.md) | Calorie Counter Nutrition App | 3-Advanced | +| [Boole Bots Game](./Projects/Boole-Bot-Game.md) | Battling Bots driven by Boolean algebra | 3-Advanced | +| [Calorie Counter](./Projects/Calorie-Counter-App.md) | Calorie Counter Nutrition App | 3-Advanced | | [Chat App](./Projects/Chat-App.md) | Real-time chat interface | 3-Advanced | -| [Elevator](./Projects/Elevator-App.md) | Elevator simulator | 3-Advanced | -| [Fast Food Simulator](./Projects/FastFood-App.md) | Fast Food Restaurant Simulator | 3-Advanced | -| [Instagram Clone](./Projects/Instagram-Clone-App.md) | A clone of Facebook's Instagram app | 3-Advanced | +| [Elevator](./Projects/Elevator-App.md) | Elevator simulator | 3-Advanced | +| [Fast Food Simulator](./Projects/FastFood-App.md) | Fast Food Restaurant Simulator | 3-Advanced | +| [Instagram Clone](./Projects/Instagram-Clone-App.md) | A clone of Facebook's Instagram app | 3-Advanced | | [GitHub Timeline](./Projects/GitHub-Timeline-App.md) | Generate a timeline of a users GitHub Repos | 3-Advanced | | [Kudos Slackbot](./Projects/Kudos-Slackbot.md) | Give recognition to a deserving peer | 3-Advanced | -| [Movie App](./Projects/Movie-App.md) | Browse, Find Ratings, Check Actors and Find you next movie to watch | 3-Advanced | -| [MyPodcast Library](./Projects/MyPodcast-Library-app.md) | Create a library of favorite podcasts | 3-Advanced | -| [NASA Exoplanet Query](./Projects/NASA-Exoplanet-Query.md) | Query NASA's Exoplanet Archive | 3-Advanced | -| [Shell Game](./Projects/Shell-Game.md) | Animated shell game | 3-Advanced | -| [Shuffle Deck](./Projects/Shuffle-Deck-App.md) | Evaluate different algorithms for shuffling a card deck | 3-Advanced | +| [Movie App](./Projects/Movie-App.md) | Browse, Find Ratings, Check Actors and Find you next movie to watch | 3-Advanced | +| [MyPodcast Library](./Projects/MyPodcast-Library-app.md) | Create a library of favorite podcasts | 3-Advanced | +| [NASA Exoplanet Query](./Projects/NASA-Exoplanet-Query.md) | Query NASA's Exoplanet Archive | 3-Advanced | +| [Shell Game](./Projects/Shell-Game.md) | Animated shell game | 3-Advanced | +| [Shuffle Deck](./Projects/Shuffle-Deck-App.md) | Evaluate different algorithms for shuffling a card deck | 3-Advanced | | [Slack Archiver](./Projects/Slack-Archiver.md) | Archive Slack Messages | 3-Advanced | | [Spell-It App](./Projects/SpellIt-App.md) | A twist on the classic Speak N Spell game | 3-Advanced | | [Survey App](./Projects/Survey-App.md) | Define, conduct, and view a survey | 3-Advanced | @@ -147,8 +148,8 @@ Do you have any suggestions on how we could improve this project overall? Let us ### Main Contributors 🙂🙂 -- **Florin Pop**: [Twitter](https://twitter.com/florinpop1705) - [website](https://florin-pop.com). -- **Jim Medlock**: [Twitter](https://twitter.com/jd_medlock) - [articles](https://medium.com/@jdmedlock) +- **Florin Pop**: [Twitter](https://twitter.com/florinpop1705) - [website](https://florin-pop.com). +- **Jim Medlock**: [Twitter](https://twitter.com/jd_medlock) - [articles](https://medium.com/@jdmedlock) ## Weekly Coding Challenge 🚀