Tweeter Frontend - This is a social network that posibility interact with tweets, user, comment and bookmarks. This was make with TypeScript how language programming, Storybook to documentation, Jest for unitary/integration tests, Cypress to e2e tests and all informatios/interactions was make consuming a own api make with nodejs.
- - Create an account.
- - Sign in in your account.
- - View the optimal layout for the app depending on their device's screen size
- - View tweets by user.
- - Scroll infinite with SWR in all pages.
- - Filter tweets by Media, Likes, Top, Latest and Tweets
- - Follow/Unfolllow a user.
- - Change image of avatar and background from user.
- - List followings and followers from user.
- - Edit informations from user.
- - Show bookmarks filtered.
- - View your profile.
- - View users and profile from another users.
- - Search tweets by content.
- - Search people by name.
- - View your feed.
- - Create new tweet public/private.
- - Create new tweet with image.
- - Delete a tweet.
- - Like/unlike a tweet.
- - Save/unsave tweet how bookmark.
- - Create a comment.
- - Like/unlike a comment.
- - Delete a comment.
- - Show main trends.
- - Show a season that recommend who follow.
- - Toggle the color scheme between light and dark mode
- - Keep light/dark mode, even after refreshing the browser.
- - Logout your account.
You must have the tools installed: Git, Node.js. And create a new file called: .env.local, that follow .env.example credentials example for connect with a api or execute backend this application.
# In the terminal, clone the project: $ git clone https://github.com/Wesley-wsl/Tweeter-frontend.git # Enter the project folder: $ cd Tweeter-frontend # Install dependencies: $ yarn or $ npm install # Run the application: $ yarn dev or $ npm run dev
Okay, now you can access the application from the route: https://localhost:3000/
Now the tests about this application was make with Jest and React Testing Library to unitary/integration tests, for tests e2e I used Cypress.
To run the unitary/integration tests you need only execute yarn test:coverage
in the terminal in this directory.
Now if you want run the tests e2e in Cypress, first of all execute de backend and frontend, create an user and put email and password this user in a file in the root of this directory called cypress.env.json, make this how cypress.env.example. This is only to pass for authentication flux because it is validate with server side rendering, then mock this is not possible now. Maked this you need execute yarn cypress
in your terminal in this directory and the magic will happen, you have access to e2e tests with cypress for execute in your machine.