Skip to content

Commit 87c46d5

Browse files
akshaykumar6akshaykumar6
committed
App to show news headlines using redux and react native which can be filtered country and category wise
1 parent 1e76655 commit 87c46d5

19 files changed

+1153
-57
lines changed

‎.babelrc

+8
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
{
2+
"presets": ["babel-preset-expo"],
3+
"env": {
4+
"development": {
5+
"plugins": ["transform-react-jsx-source"]
6+
}
7+
}
8+
}

‎.flowconfig

+75
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,75 @@
1+
[ignore]
2+
; We fork some components by platform
3+
.*/*[.]android.js
4+
5+
; Ignore templates for 'react-native init'
6+
<PROJECT_ROOT>/node_modules/react-native/local-cli/templates/.*
7+
8+
; Ignore RN jest
9+
<PROJECT_ROOT>/node_modules/react-native/jest/.*
10+
11+
; Ignore RNTester
12+
<PROJECT_ROOT>/node_modules/react-native/RNTester/.*
13+
14+
; Ignore the website subdir
15+
<PROJECT_ROOT>/node_modules/react-native/website/.*
16+
17+
; Ignore the Dangerfile
18+
<PROJECT_ROOT>/node_modules/react-native/danger/dangerfile.js
19+
20+
; Ignore Fbemitter
21+
<PROJECT_ROOT>/node_modules/fbemitter/.*
22+
23+
; Ignore "BUCK" generated dirs
24+
<PROJECT_ROOT>/node_modules/react-native/\.buckd/
25+
26+
; Ignore unexpected extra "@providesModule"
27+
.*/node_modules/.*/node_modules/fbjs/.*
28+
29+
; Ignore polyfills
30+
<PROJECT_ROOT>/node_modules/react-native/Libraries/polyfills/.*
31+
32+
; Ignore various node_modules
33+
<PROJECT_ROOT>/node_modules/react-native-gesture-handler/.*
34+
<PROJECT_ROOT>/node_modules/expo/.*
35+
<PROJECT_ROOT>/node_modules/react-navigation/.*
36+
<PROJECT_ROOT>/node_modules/xdl/.*
37+
<PROJECT_ROOT>/node_modules/reqwest/.*
38+
<PROJECT_ROOT>/node_modules/metro-bundler/.*
39+
40+
[include]
41+
42+
[libs]
43+
node_modules/react-native/Libraries/react-native/react-native-interface.js
44+
node_modules/react-native/flow/
45+
node_modules/expo/flow/
46+
47+
[options]
48+
emoji=true
49+
50+
module.system=haste
51+
52+
module.file_ext=.js
53+
module.file_ext=.jsx
54+
module.file_ext=.json
55+
module.file_ext=.ios.js
56+
57+
munge_underscores=true
58+
59+
module.name_mapper='^[./a-zA-Z0-9$_-]+\.\(bmp\|gif\|jpg\|jpeg\|png\|psd\|svg\|webp\|m4v\|mov\|mp4\|mpeg\|mpg\|webm\|aac\|aiff\|caf\|m4a\|mp3\|wav\|html\|pdf\)$' -> 'RelativeImageStub'
60+
61+
suppress_type=$FlowIssue
62+
suppress_type=$FlowFixMe
63+
suppress_type=$FlowFixMeProps
64+
suppress_type=$FlowFixMeState
65+
suppress_type=$FixMe
66+
67+
suppress_comment=\\(.\\|\n\\)*\\$FlowFixMe\\($\\|[^(]\\|(\\(>=0\\.\\(5[0-6]\\|[1-4][0-9]\\|[0-9]\\).[0-9]\\)? *\\(site=[a-z,_]*react_native_oss[a-z,_]*\\)?)\\)
68+
suppress_comment=\\(.\\|\n\\)*\\$FlowIssue\\((\\(>=0\\.\\(5[0-6]\\|[1-4][0-9]\\|[0-9]\\).[0-9]\\)? *\\(site=[a-z,_]*react_native_oss[a-z,_]*\\)?)\\)?:? #[0-9]+
69+
suppress_comment=\\(.\\|\n\\)*\\$FlowFixedInNextDeploy
70+
suppress_comment=\\(.\\|\n\\)*\\$FlowExpectedError
71+
72+
unsafe.enable_getters_and_setters=true
73+
74+
[version]
75+
^0.56.0

‎.gitignore

+13-55
Original file line numberDiff line numberDiff line change
@@ -1,59 +1,17 @@
1-
# Logs
2-
logs
3-
*.log
4-
npm-debug.log*
5-
yarn-debug.log*
6-
yarn-error.log*
7-
8-
# Runtime data
9-
pids
10-
*.pid
11-
*.seed
12-
*.pid.lock
13-
14-
# Directory for instrumented libs generated by jscoverage/JSCover
15-
lib-cov
16-
17-
# Coverage directory used by tools like istanbul
18-
coverage
19-
20-
# nyc test coverage
21-
.nyc_output
22-
23-
# Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files)
24-
.grunt
25-
26-
# Bower dependency directory (https://bower.io/)
27-
bower_components
28-
29-
# node-waf configuration
30-
.lock-wscript
1+
# See https://help.github.com/ignore-files/ for more about ignoring files.
312

32-
# Compiled binary addons (http://nodejs.org/api/addons.html)
33-
build/Release
3+
# expo
4+
.expo/
345

35-
# Dependency directories
36-
node_modules/
37-
jspm_packages/
6+
# dependencies
7+
/node_modules
388

39-
# Typescript v1 declaration files
40-
typings/
41-
42-
# Optional npm cache directory
43-
.npm
44-
45-
# Optional eslint cache
46-
.eslintcache
47-
48-
# Optional REPL history
49-
.node_repl_history
50-
51-
# Output of 'npm pack'
52-
*.tgz
53-
54-
# Yarn Integrity file
55-
.yarn-integrity
56-
57-
# dotenv environment variables file
58-
.env
9+
# misc
10+
.env.local
11+
.env.development.local
12+
.env.test.local
13+
.env.production.local
5914

15+
npm-debug.log*
16+
yarn-debug.log*
17+
yarn-error.log*

‎.watchmanconfig

+1
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
{}

‎App.js

+45
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,45 @@
1+
import React, { Component } from 'react';
2+
import { WebView, StyleSheet, Text, View, Image, TextInput, Button, TouchableOpacity, ScrollView, FlatList, TouchableHighlight, TouchableNativeFeedback, TouchableWithoutFeedback } from 'react-native';
3+
import { createStore, applyMiddleware } from 'redux';
4+
import { Provider, connect } from 'react-redux';
5+
import thunk from 'redux-thunk'
6+
import reducer from './src/reducers'
7+
import Main from './src/components/main'
8+
9+
10+
const middleware = [ thunk ]
11+
12+
const store = createStore(
13+
reducer,
14+
applyMiddleware(...middleware)
15+
)
16+
17+
18+
export default class App extends Component {
19+
20+
constructor(props) {
21+
super(props);
22+
}
23+
24+
componentDidMount() {
25+
console.log("App componentDidMount");
26+
}
27+
28+
render() {
29+
console.disableYellowBox = true;
30+
return (
31+
<Provider store={store}>
32+
<Main />
33+
</Provider>
34+
);
35+
}
36+
}
37+
38+
const styles = StyleSheet.create({
39+
container: {
40+
flex: 1,
41+
backgroundColor: '#fafafa',
42+
alignItems: 'center',
43+
justifyContent: 'center'
44+
}
45+
});

‎App.test.js

+9
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
import React from 'react';
2+
import App from './App';
3+
4+
import renderer from 'react-test-renderer';
5+
6+
it('renders without crashing', () => {
7+
const rendered = renderer.create(<App />).toJSON();
8+
expect(rendered).toBeTruthy();
9+
});

‎README.md

+22-2
Original file line numberDiff line numberDiff line change
@@ -1,2 +1,22 @@
1-
# headlines
2-
A react native app to get news
1+
# Headlines App
2+
3+
It's an app to get news headlines from over 30,000 news sources and blogs using [News API](https://newsapi.org) for learning react native development.
4+
5+
## Installation
6+
7+
Clone the repository
8+
9+
#### `git clone [email protected]:akshaykumar6/headlines.git`
10+
11+
In the project directory, install dependencies:
12+
13+
#### `npm install`
14+
15+
and run
16+
17+
#### `npm start`
18+
19+
Runs the app in the development mode.<br>
20+
21+
22+
Authored and maintained by [Akshay Sharma](https://akshaykumar6.github.io/).

‎app.json

+5
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
{
2+
"expo": {
3+
"sdkVersion": "26.0.0"
4+
}
5+
}

‎package.json

+36
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
{
2+
"name": "headlines",
3+
"version": "0.1.0",
4+
"private": true,
5+
"devDependencies": {
6+
"react-native-scripts": "1.13.1",
7+
"jest-expo": "26.0.0",
8+
"react-test-renderer": "16.3.0-alpha.1"
9+
},
10+
"main": "./node_modules/react-native-scripts/build/bin/crna-entry.js",
11+
"scripts": {
12+
"start": "react-native-scripts start",
13+
"eject": "react-native-scripts eject",
14+
"android": "react-native-scripts android",
15+
"ios": "react-native-scripts ios",
16+
"test": "jest"
17+
},
18+
"jest": {
19+
"preset": "jest-expo"
20+
},
21+
"dependencies": {
22+
"axios": "^0.18.0",
23+
"expo": "^26.0.0",
24+
"prop-types": "^15.6.1",
25+
"react": "16.3.0-alpha.1",
26+
"react-native": "0.54.0",
27+
"react-native-modal-dropdown": "^0.6.2",
28+
"react-native-vector-icons": "^4.6.0",
29+
"react-navigation": "^1.5.11",
30+
"react-navigation-redux-helpers": "^1.0.3",
31+
"react-redux": "^5.0.7",
32+
"redux": "^3.7.2",
33+
"redux-axios-middleware": "^4.0.0",
34+
"redux-thunk": "^2.2.0"
35+
}
36+
}

‎src/actions/index.js

+80
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,80 @@
1+
import axios from 'axios';
2+
3+
/*
4+
* action types
5+
*/ 
6+
export const FETCH_HEADLINES_REQUEST = 'FETCH_HEADLINES_REQUEST'
7+
export const FETCH_HEADLINES_SUCCESS = 'FETCH_HEADLINES_SUCCESS'
8+
export const FETCH_HEADLINES_ERROR = 'FETCH_HEADLINES_ERROR'
9+
export const HEADLINES_COUNTRY = 'HEADLINES_COUNTRY'
10+
export const HEADLINES_CATEGORY = 'HEADLINES_CATEGORY'
11+
 
12+
/*
13+
* other constants
14+
*/
15+
 
16+
17+
 
18+
/*
19+
* action creators
20+
*/
21+
 
22+
export const fetchingHeadlines = () => ({
23+
type: FETCH_HEADLINES_REQUEST
24+
})
25+
26+
export const fetchHeadlinesSuccess = (data) => ({
27+
type: FETCH_HEADLINES_SUCCESS,
28+
data
29+
})
30+
31+
export const fetchHeadlinesError = (data) => ({
32+
type: FETCH_HEADLINES_ERROR,
33+
data
34+
})
35+
36+
export const setCountryForHeadlines = (country) => ({
37+
type: HEADLINES_COUNTRY,
38+
country
39+
})
40+
41+
export const setCategoryForHeadlines = (category) => ({
42+
type: HEADLINES_CATEGORY,
43+
category
44+
})
45+
46+
export const fetchHeadlines = () => (dispatch, getState) => {
47+
dispatch(fetchingHeadlines())
48+
let state = getState();
49+
console.log("::::::::: fetchingHeadlines ::::::::::::::::")
50+
console.log(state);
51+
52+
let country = state.headlines.country;
53+
let category = state.headlines.category;
54+
55+
if (!country) {
56+
country='in'
57+
}
58+
59+
60+
API_BASE_URL = "https://newsapi.org/v2"
61+
API_KEY = "a6a21e07f9ef4e5fb89b5f5eab675095"
62+
apiURL = `${API_BASE_URL}/top-headlines?pageSize=100&country=${country}`
63+
64+
if (category) {
65+
apiURL+=`&category=${category}`
66+
}
67+
68+
apiURL+=`&apiKey=${API_KEY}`
69+
70+
axios.get(apiURL)
71+
.then(function(response){
72+
console.log(response.data); // ex.: { user: 'Your User'}
73+
console.log(response.status); // ex.: 200
74+
dispatch(fetchHeadlinesSuccess(response.data))
75+
})
76+
.catch(function(response){
77+
console.log(response.data);
78+
dispatch(fetchHeadlinesError(response.data))
79+
});
80+
}

0 commit comments

Comments
 (0)