This is a single page BlogSite template.
I have created it to improve my React skills. I am new at web development. In a proverb it says: "I forget what I hear, I remember what I see, I know what I do." This is my third React project. in every next project I recognize what I did wrong in the previous projects. When I was doing this project I was also thinking about optimizing my previous projects. So in short I am keep learning.
The project is generated by React [Redux], [axios], [react-helmet], [moment], [react-router],[redux-thunk],[react-ckeditor-component]. For Backend [LoopBack3] is used.
I will explain feautures of the site from top to down.
In the top nav a there are language selection links. Application is multilinguale. It supports English (en) Turkish (tr) and German (de) languages. Menu languages changes according to the selected language. I used three i18n files to keep translations of these languages in json format. I handle the selected language in the [languageReducer]. I also save users language preference in the local storage. When page loads user will allways see his/her selected language.
For date and time I used [moment] library. By the help of a small condition user sees date time in his/her selected language.
Every article has a language key. User sees articles only in his/her langugae.
###NavBar
I chose a fixed navbar. When the widt is less than 740 pixels it collapses. Every Component in the navbar is located under [navbar] folder and folder names are self explenatory.
BrandName: It is linked to "/". About: It is linked to "/link/about". Terms: It is linked to "/link/terms". Offers: Gets offer names from an array. Displays names according o the selected language.
The links following are visible according to authentication. All authentication components are located in the [auth] folder. Login: It is linked to "/admin" with the component [Authentication].
###Home
I used React-Router to make every single page has a distinguished link to make them reachable from search engines. Every article has a description key in the db. I used [react-helmet] to manipulate page title and description for SEO.
I used [react-ckeditor-component] for adding and editing contents.
###authentication Authentication component have three componets toggles between signIn, signUp and passwordReset forms.
Signup needs email verification. I used nodemailer which comes default by LoopBack. User can login only after email verification.
I integrated a password resetform as well. User can change his/her password by token send to their email.
##License MIT Copy Erdogan Cihan;