hzraevets / fake-twitter

Fake Twitter

A very simple Twitter-like web application, assigned from react-assignments, you can check it online first https://hzraevets.github.io/fake-twitter/.

Tech-Stack

• React
• TailwindCSS
• Ant Design
• React Query
• React Hook Form
• React Testing Library
• Storybook

Not all the 3rd-party libraries / tools which are used in this project, are listed here. Like this project is initialized with create react app. So, feel free to explore them at your own.

Features

• Register an account (store data in LocalStorage)
• Login & logout
• CRUD tweets
• Load more tweets via scroll down
• Switch theme
• 1 column in iPhone screen size, 2 columns in iPad screen size

Setup

You should clone this project to your machine first:

git clone https://github.com/hzraevets/fake-twitter

enter into the project folder:

cd fake-twitter

and make sure you have Node.js installed first, then execute this command to install all dependencies:

npm install

Development

You may want to add some more features into this project, or modify existing code. So you should start up a dev server locally to check what's the app be like at real-time. Just execute this command:

npm start

Open http://localhost:3000 to view it in the browser. The page will reload if you make edits. You will also see any lint errors in the console.

Add new commit

Once you finish your task and want to add a new commit, instead of using git commit, you should use the following command here:

npm run commit

Testing

npm test

Launches the test runner in the interactive watch mode. See the section about running tests for more information.

Storybook

npm run storybook

Open http://localhost:6006/?path=/story/views-login--preview to view all the stories.

Deployment

App

If you want to do all these work at your own:

npm run build

Builds the app for production to the build folder. It correctly bundles React in production mode and optimizes the build for the best performance.

Also, dockerfile is provided under ci, you can build it to an image first:

docker build -f ci/app.dockerfile -t fake-twitter-app .

and then run the container:

docker run -d --name app -p 3000:80 fake-twitter-app

Then you can visit http://localhost:3000 to check the app.

Storybook

Deploy storybook is similar to deploy app.