Clone of The New York Times website, built with React and New York Times API
NyTimes Clone is a web application that aims to recreate the user interface and functionality of The New York Times website. Built using modern web technologies such as React.js for deployment, this clone provides a similar browsing experience to the original website. Articles data are fetched from the New York Times API. User can explore three main routes:
- The Home Page, which contains most relevant articles currently on the first page;
- Specific Sections, like Tech, Health, Science, which display most relevant articles of such categories;
- Search Section, which displays paginated articles based on the keyword typed by the user in the search-bar. Articles can be sorted by "relevance", "newest" and "oldest".
- React.js
- CSS modules
- Axios
- react-js-pagination
- react-responsive
- react-animation-on-scroll
- react-spring
Running the application requires Node to be installed on your operating system.
You can then install the latest version of npm from your terminal with the command:
npm install npm@latest -g
-
Clone the repository locally with the git command:
git clone https://github.com/berkbeleli/NyTimes-Clone.git
-
Install NPM packages:
npm install
-
Create an account on New York Times API website and follow the instructions to get your api-key
-
Create a .env file in the root folder with just one line:
REACT_APP_NYTIMES_API_KEY = 'ENTER YOUR API KEY'
-
Run the app with command:
npm start
NyTimes Clone is released under the MIT License. Please refer to the LICENSE
file for more details.
Project Repository: nytimes-clone
Project Website: NyTimes clone
Portfolio: berkbeleli-portfolio
![nytimes-clone-screenshot](https://user-images.githubusercontent.com/44535117/234363403-163551fb-a3f0-49b3-9e35-71ad5e34b68a.png)
![nytimes-clone-screenshot](https://user-images.githubusercontent.com/44535117/234363448-ba24f1bf-ec91-4d74-bc92-468ea510f32e.png)
![nytimes-clone-screenshot](https://user-images.githubusercontent.com/44535117/234363463-d13ffb5f-40b1-4971-a97c-dd828f6274a5.png)