By: Lola Dolinsky
This app was created with a specific audience in mind: Software Developers with a sense of humor who might consider a moonlight career in comedy! With this app, a user is greeted with a welcome message and description on the home page. The user can then navigate to a 'Get Some New Material' page where there are two options: One button generates one random programming joke; Another generates ten random programming jokes. The user can then choose to add a joke to their set. On clicking the 'My Set' tab, the user will see the jokes that they liked displayed. If the joke bombs, or maybe it seems less funny now... the user can remove it from their set.
Visit DevWit deployed site here
- Use the technology you’ve been working with over the course of the module to demonstrate mastery of the following:
-
- React fundamentals
-
- React Router
-
- Asynchronous JavaScript
- Integration and unit testing utilizing react-dom and Jest libraries
- Work within constraints to deliver a unique product for an audience which helps them in some way
- Utilize an API build an app that displays data relevant to a specific audience
Your applications should have the following core functionality: Display the data from the API in a way that applies directly to your audience Ability for users to store/manipulate the data displayed in the application, such as favoriting or adding to a list
- React (w/ hooks)
- React Testing (with Jest)
- Global state management w/
use-global-hook
- React Router
- JavaScript ES6
- JSX
- Circle CI
- git version control
- GitHub Project Board
- Heroku
Setup
- Click the Fork button on the top right-hand corner of this page
- Clone the repository down and cd into the repo on your local machine by running:
git clone [email protected]:lo-la-do-li/devWit.git
- cd into
devWit
locally
- Install the library dependencies by running:
npm install
- To verify that it is setup correctly, run
npm start
in your terminal. - Go to
http://localhost:3000/
and you should see the site. - Enter
control + c
in your terminal to stop the server at any time. - Run
npm test
to view passing unit and integration tests - Add your changes, push up to GitHub and submit a pull request
- Learning and implementing use-global-hook for state management of jokes displayed in My Set
- Producing all app logic, API calls, testing suites, and styling in less than a week
- Managing state via use-global-hook
- Making API calls to a remote joke server
- Passing, manipulating, and displaying data on the UI
- 100% Lighthouse Accessibility score
With more time, I would like to enhance the UI/UX by:
- Adding a "crickets/bomb" or "applause" button to indicate whether the joke was successful
- Adding a form to joke cards so that user can write notes and/or edit
- Enhance stylings
- Link to external Express server so that original jokes can be edited by the user and saved