Angular 2 News Application
$30-250 USD
Pago na entrega
Components
The app has following components:
AppComponent: Main Component
HeaderComponent: Display the logo
SectionsComponent: Display different sections of news
NavbarComponent: Display sub-sections of news
NewsComponent: Will fetch the complete list of news and send to NewsItemComponent
NewsItemComponent: Display each news item
SectionsComponent
Subscribe and fetch the list of sections from store
Loop through the array and display each section name as routerLink
It should change the url as /section/sectionName
NavbarComponent
Display Subsections
Get the list of news from the store
Multiple news might be categorized in one subsection. Filter list of unique subsections from the list and display in the navbar
Filter News
When a user clicks on subsection, dispatch action and send the subsection name as a parameter to store
This action will update the filter variable in store
NewsComponent
Send the name of the selected section to Service and get the list of news.
Send this list of news to update store
Now subscribe store to get the news list and send it to NewsItemComponent
NewsItemComponent
Get news item from NewsComponent and display it
Show image and caption when clicked on "Read More"
Services
NewsService
The Service will have a function called getSectionNews().
This function will fetch news list of the selected section, from the NY Times API.
API url:
url = '[login to view URL]' + sectionName + '.json?api-key=315a5a51483b469a918246dc2753b339'
Actions
Action
Implement the following two actions:
LOAD_SECTION_NEWS: Will be dispatched when the user wants to load a new section.
FILTER_SUBSECTION: Will be dispatched when one of the news sub-section is clicked.
Reducers
Reducer: Sections
Implement LOAD_SECTIONS action
When this action is dispatched, the reducer will return the state having list of sections.
Reducer: News
This reducer will implement two actions:
LOAD_SECTION_NEWS: This will load news from selected section to newsList in store.
FILTER_SUBSECTION: Sets the value of filter in store
Selector
This will get the news list and filter from the reducer
Return a new list of news, based on the selected subsection
ID do Projeto: #17520600
Sobre o projeto
17 freelancers estão ofertando em média $254 nesse trabalho
We are very interested in this project. I have read your project description and very much confident in completing all these requirements. Kindly initiate messaging so we can discuss further.
How are you, tamhanemohak?. .I can do this project as well We have experience in thoses skills: Angular.js, HTML5,PHP, node.js. I always: -Do project fast as possible. -Charg Mais
Hello, Thank you for giving a look at my profile! With 7+ years of experience in web application development, web & mobile designing, mobile application development, wordpress cms development, theme & template cust Mais
Hello, How are you? We are a team and we have understood about your work what you exactly want. We just saw your project description carefully. We are very interested in your project. We have rich experience in web, ap Mais
Hello Sir, Hope you are doing well, I have read your requirement and understood that you are looking an experienced Web developer to develop an Angular 2 News Application. I have team of experienced web develo Mais
I have 4+ years of experience into web development in technologies like HTML, CSS, Javascript, Bootstrap, SCSS, etc. Specialized into Angular framework. Have 1 year of experience in Angular 4. Worked in Healthcare, Mais