DEV Community

Cover image for 5 Refreshing Project Ideas for JS Devs
Wade Zimmerman
Wade Zimmerman

Posted on • Updated on • Originally published at devmap.org

5 Refreshing Project Ideas for JS Devs

People seemed to like my last post, so I decided to add another 5 projects!

In case you did not read the first post, the goal of this list is to provide project ideas that are half way unique, challenging, and fresh.


How to Take Advantage

Each item in the list has a set of requirements. Feel free to deviate from the requirements, but keep in mind that this decision comes at a cost.

If you are using these ideas to develop your skills, you ought to code with discipline. Why? Because deviating to much requires creativity which can quickly cause burnout. Sticking to a semi-rigid plan can help the flow of productivity and let you see the project to its end.

Only you know your skill level, so you should tailor the project ideas accordingly. Forewarning, these ideas require more dedication and problem solving than a typical "Todo List" app. If you take up the challenge, you can expect time spent to be on the magnitude of weeks or months.

This Weeks Theme (Planning)

The projects this week are broad ideas which can quickly get out of hand. If you do not manage your time wisely or plan ahead you may end up adding too many features or get stuck perfecting a low priority task.


1. Fish Catapult Game

Build a 2D app, preferably cross platform, which has one objective, throw a fish back into the water. Players are challenged by obstacles, physics, and time/efficiency. Realistically, this would be a single player game with a series of levels, but nothing is stopping you from making this multiplayer. Bonus points if you make this app from scratch, meaning you make your own game engine.

AI Generated Image for Fish Catapult

Skills

  • Game Development
  • Physics
  • Animation

Areas for Project Expansion

  • Procedural Level Generation
  • Health and Power-ups
  • Time Trials

Challenges

  • Performance
  • Art
  • Cross platform

2. Sports Player Stats Profile

Use web scraping to find player stats in your favorite sports/e-sports league. Collect the data to provide users with a up-to-date, performant, and highly responsive web page. Ideally, the site would contain more than one statistic, player, and team. Make use of local storage, asynchronous calls, and authentication to get around common web scraping prevention.

Courtesy of Dribbble

Skills

  • Knowledge of DOM
  • HTTP Protocol
  • Reverse Engineering

Areas for Project Expansion

  • Allow users to request for data update
  • Defer scraping by using asynchronous queue system
  • Provide API for future developers looking for similar data.

Challenges

  • Bypassing Security Features
  • Parsing Data
  • Storing/caching Data

3. Plagiarism Checker

Display the similarities between two text inputs, or two files, and provide a score which states how similar they are.

Courtesy of Dribbble

Skills

  • Algorithms
  • Presentation
  • Statistics

Areas for Project Expansion

  • Collect data/submissions to provide plagiarism score against other people.
  • Detect similar wording not just exact matches.
  • Provide suggestions to improve submission.

Challenges

  • How many duplicate words/characters are considered plagiarism?
  • Diffing Algorithm
  • Scoring Algorithm

4. 2D Rain Water Simulator

Build or find a set of data consisting of 2-dementional points representing the height of terrain. For example [[0,5],[2,3],[1,6]] the first number represents the X coordinate and the second number represents the Y coordinate.

Once you have your data and terrain, simulate how water collects on the terrain. Valleys should collect water and mountains/hills should create run off.

Courtesy of Dribbble

Skills

  • Math (Local min/max)
  • Algorithms
  • Canvas

Areas for Project Expansion

  • Simulate more physics such as air pressure, erosion, or friction
  • Animate spill over.
  • Provide controls to vary rainfall or terrain height.
  • Add 3rd dimension

Challenges

  • Fidelity
  • Performance (at scale)

5. Web Based Finance Manager

Provide an app which allows users to visualize their money across multiple bank accounts, credit cards, and cryptocurrencies. The app should track the balance of accounts over time. Bonus points if the visualization includes charts and other graphics.

Courtesy of Dribbble

Skills

  • State Management.
  • Reactivity.
  • Floating Point Arithmetic.

Areas for Project Expansion

  • Synchronize account balances with banking servers.
  • Automatically calculate/estimate interest.
  • Allow users to automate parts of the app.
  • Provide planning tools such as budgeting.

Challenges

  • Secure storage.
  • Accurate numbers.
  • Practical features (UI/UX).

Conclusion

Hopefully these projects seem interesting to you are help you think of fresh ideas. Please comment additional project ideas or share your creations.

Top comments (1)

Collapse
 
andrewbaisden profile image
Andrew Baisden

These projects are great definitely thinking outside of the box.