diff --git a/components/common/header/index.js b/components/common/header/index.js
index 73d451384..d36375ba8 100644
--- a/components/common/header/index.js
+++ b/components/common/header/index.js
@@ -63,7 +63,14 @@ class NavBar extends React.Component {
render() {
const pathName = this.props.router.pathname;
const metaData = MetaInfo[pathName === '/' ? 'home' : pathName.split('/')[1]];
- const title = metaData.title;
+ const title =
+ pathName.split('/')[1] === 'learn' && pathName.split('/')[2]
+ ? `${this.props.router.query.chapter.replace(
+ /-/gi,
+ ' '
+ )} | Learn ${this.props.router.query.subject[0].toUpperCase() +
+ this.props.router.query.subject.slice(1)} | Coderplex`
+ : metaData.title;
const description = metaData.description;
const image = metaData.image;
return (
diff --git a/components/learn/subject-card.js b/components/learn/subject-card.js
index 25cf10ff8..d6c0a2f63 100644
--- a/components/learn/subject-card.js
+++ b/components/learn/subject-card.js
@@ -81,7 +81,7 @@ export default ({ subject }) => (
-
{subject.title}
+
Learn {subject.title}
{subject.domain}
@@ -95,11 +95,26 @@ export default ({ subject }) => (
20 hours
-
-
+ {subject.isGuideCompleted ? (
+
+
+ VIEW GUIDE
+
+
+ ) : (
+
VIEW GUIDE
-
+ )}
);
diff --git a/components/learn/subject-marked.js b/components/learn/subject-marked.js
index 9b3f46444..517100dad 100644
--- a/components/learn/subject-marked.js
+++ b/components/learn/subject-marked.js
@@ -1,6 +1,8 @@
import React from 'react';
import marked from 'marked';
import styled from 'react-emotion';
+import ContentLoader from 'react-content-loader';
+
import { breakpoints } from '../../utils/base.styles';
const Marked = styled.div`
@@ -101,7 +103,17 @@ export default class MarkedJS extends React.Component {
return (
{this.props.loading ? (
-
Loading...
+
+
+
+
+
+
+
+
+
+
+
) : (
true),
- activeUnit: this.props.data[0].unit.name,
- activeChapter: this.props.data[0].chapters[0].url,
- };
+export default withRouter(
+ class SyllabusTree extends React.Component {
+ state = {
+ nodeStateTracker: [false, ...this.props.data.map(() => true).slice(1)],
+ activeUnit: this.props.data[0].unit,
+ activeChapter: this.props.data[0].chapters[0].cdnUrl,
+ };
- handleClick = i => {
- this.setState({
- nodeStateTracker: [
- ...this.state.nodeStateTracker.slice(0, i),
- !this.state.nodeStateTracker[i],
- ...this.state.nodeStateTracker.slice(i + 1),
- ],
- });
- };
+ handleClick = i => {
+ this.setState({
+ nodeStateTracker: [
+ ...this.state.nodeStateTracker.slice(0, i),
+ !this.state.nodeStateTracker[i],
+ ...this.state.nodeStateTracker.slice(i + 1),
+ ],
+ });
+ };
- clickOnChapter(chapter, unitName) {
- if (chapter.url !== this.state.activeChapter) {
- this.setState({ activeChapter: chapter.url, activeUnit: unitName });
- this.props.changeChapter(chapter);
+ clickOnChapter(chapter, unitName) {
+ if (chapter.cdnUrl !== this.state.activeChapter) {
+ this.setState({ activeChapter: chapter.cdnUrl, activeUnit: unitName });
+ this.props.changeChapter(chapter);
+ }
}
- }
- render() {
- const Container = styled.div`
- & .chapter {
- padding: 5px;
- font-size: 0.85rem;
- user-select: none;
- border-left: 2px solid #fff;
- color: #888;
- :hover {
+ render() {
+ const Container = styled.div`
+ & .chapter {
+ padding: 5px;
+ font-size: 0.85rem;
+ user-select: none;
+ border-left: 2px solid #fff;
+ color: #888;
+ :hover {
+ background-color: #f5f5f5;
+ border-left: 2px solid #374355;
+ cursor: pointer;
+ }
+ }
+
+ & .active {
+ color: #374355;
background-color: #f5f5f5;
border-left: 2px solid #374355;
- cursor: pointer;
+ :hover {
+ cursor: default;
+ }
}
- }
- & .active {
- color: #374355;
- background-color: #f5f5f5;
- border-left: 2px solid #374355;
- :hover {
- cursor: default;
+ & .unit_name {
+ order: 1;
+ flex: 1 1 auto;
+ align-self: auto;
}
- }
+ `;
- & .unit_name {
- order: 1;
- flex: 1 1 auto;
- align-self: auto;
- }
- `;
-
- return (
-
- {this.props.data.map((unitNode, i) => {
- const UnitNameComponent = (
- this.handleClick(i)}>
- {unitNode.unit.name}
-
- );
- return (
- this.handleClick(i)}>
- {unitNode.chapters.map(chapter => (
- this.clickOnChapter(chapter, unitNode.unit.name)}>
- {chapter.name}
-
- ))}
-
- );
- })}
-
- );
+ return (
+
+ {this.props.data.map((unitNode, i) => {
+ const UnitNameComponent = (
+ this.handleClick(i)}>
+ {unitNode.unit}
+
+ );
+ return (
+ this.handleClick(i)}>
+ {unitNode.chapters.map(chapter => (
+ this.clickOnChapter(chapter, unitNode.unit)}>
+ {chapter.name}
+
+ ))}
+
+ );
+ })}
+
+ );
+ }
}
-}
+);
diff --git a/next.config.js b/next.config.js
index de85ea17c..dabf74431 100644
--- a/next.config.js
+++ b/next.config.js
@@ -8,91 +8,382 @@ const listOfSubjects = [
id: '2132',
title: 'Laravel',
domain: 'Web Development',
- url: '/learn/laravel',
+ path: '/learn/laravel/Choosing-laravel',
subjectId: 'laravel',
icon: 'devicon-laravel-plain colored',
learningCount: '20',
- learnGuideStatus: true,
+ isGuideCompleted: true,
+ githubUrl: 'https://github.com/coderplex/learn/blob/master/web-dev/Backend/Learn-Laravel.md',
},
{
id: '213',
title: 'ReactJS',
domain: 'Web Development',
- url: '/learn/reactjs',
+ path: '/learn/reactjs/Choosing-ReactJS',
subjectId: 'reactjs',
icon: 'devicon-react-original colored',
learningCount: '28',
- learnGuideStatus: false,
+ isGuideCompleted: true,
+ githubUrl:
+ 'https://github.com/coderplex/learn/blob/master/web-dev/Frontend/Libraries%20%26%20Frameworks/Learn-React.md',
},
{
id: '2131',
title: 'Go',
domain: 'Programming Language',
- url: '/learn/go',
+ path: '/learn/go',
subjectId: 'go',
- icon: 'devicon-go-plain ',
+ icon: 'devicon-go-plain colored',
learningCount: '7',
- learnGuideStatus: false,
+ isGuideCompleted: false,
+ githubUrl: 'https://github.com/coderplex/learn/blob/master/programming-languages/Go/learn-go.md',
},
{
id: '21fa3',
title: 'Android',
domain: 'Mobile Technology',
- url: '/learn/android',
+ path: '/learn/android',
subjectId: 'android',
icon: 'devicon-android-plain colored',
learningCount: '9',
- learnGuideStatus: false,
+ isGuideCompleted: false,
+ githubUrl: 'https://github.com/coderplex/learn/blob/master/mobile-dev/Android/learn-android.md',
},
{
id: '21afasda3',
title: 'Rails',
domain: 'Backend Development',
- url: '/learn/rails',
+ path: '/learn/rails',
subjectId: 'rails',
icon: 'devicon-rails-plain colored',
learningCount: '14',
- learnGuideStatus: false,
+ isGuideCompleted: false,
+ githubUrl: 'https://github.com/coderplex/learn/blob/master/web-dev/Backend/Learn-Rails.md',
},
{
id: '21wqerwqe3',
title: 'Python',
domain: 'Programming Language',
- url: '/learn/python',
+ path: '/learn/python',
subjectId: 'python',
icon: 'devicon-python-plain colored',
learningCount: '32',
- learnGuideStatus: false,
+ isGuideCompleted: false,
+ githubUrl: 'https://github.com/coderplex/learn/tree/master/programming-languages/Python',
},
{
id: '2bxcvbx13',
title: 'iOS',
domain: 'Mobile Technology',
- url: '/learn/ios',
+ path: '/learn/ios',
subjectId: 'ios',
icon: 'devicon-swift-plain colored',
learningCount: '45',
- learnGuideStatus: false,
+ isGuideCompleted: false,
+ githubUrl: 'https://github.com/coderplex/learn/blob/master/mobile-dev/iOS/Learn-iOS.md',
},
{
id: '2bxczzxcvbx13',
title: 'Javascript',
domain: 'Programming Language',
- url: '/learn/javascript',
+ path: '/learn/javascript',
subjectId: 'javascript',
icon: 'devicon-javascript-plain colored',
learningCount: '31',
- learnGuideStatus: false,
+ isGuideCompleted: false,
+ githubUrl: 'https://github.com/coderplex/learn/blob/master/web-dev/Frontend/learn-intermediate.md',
},
{
id: '2bxdfasczzxcvbx13',
title: 'Angular',
domain: 'Frontend Development',
- url: '/learn/angular',
+ path: '/learn/angular',
subjectId: 'angular',
icon: 'devicon-angularjs-plain colored',
learningCount: '3',
- learnGuideStatus: false,
+ isGuideCompleted: false,
+ githubUrl:
+ 'https://github.com/coderplex/learn/blob/master/web-dev/Frontend/Libraries%20%26%20Frameworks/Learn-Angular.md',
+ },
+];
+
+const laravelSyllabus = [
+ {
+ unit: 'Preface',
+ chapters: [
+ {
+ name: 'Choosing laravel',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/laravel/choosing-laravel.md',
+ },
+ {
+ name: 'Prerequisites',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/laravel/prerequisites.md',
+ },
+ {
+ name: 'Installation',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/laravel/installation.md',
+ },
+ ],
+ },
+ {
+ unit: 'Models, Views, Controllers and Routes',
+ chapters: [
+ {
+ name: 'Introduction to MVC',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/laravel/introduction-to-mvc.md',
+ },
+ {
+ name: 'Basic Routing and Views',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/laravel/basic-routing-and-views.md',
+ },
+ {
+ name: 'Pass Data to Views',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/laravel/pass-data-to-views.md',
+ },
+ {
+ name: 'Database Setup',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/laravel/database-setup.md',
+ },
+ {
+ name: 'Working with Query Builder',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/laravel/working-with-query-builder.md',
+ },
+ {
+ name: 'Eloquent',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/laravel/eloquent.md',
+ },
+ {
+ name: 'Controllers',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/laravel/controllers.md',
+ },
+ {
+ name: 'Route Model Binding',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/laravel/route-model-binding.md',
+ },
+ ],
+ },
+ {
+ unit: 'Front-End',
+ chapters: [
+ {
+ name: 'Layouts and Structures',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/laravel/layouts-and-structures.md',
+ },
+ {
+ name: 'Form Requests and CSRF',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/laravel/form-requests-and-CSRF.md',
+ },
+ {
+ name: 'Form Validation',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/laravel/form-validation.md',
+ },
+ {
+ name: 'Rendering',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/laravel/rendering',
+ },
+ {
+ name: 'Laravel Mix',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/laravel/laravel-mix.md',
+ },
+ {
+ name: 'Flash Messaging',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/laravel/flash-messaging.md',
+ },
+ ],
+ },
+ {
+ unit: 'Relationships',
+ chapters: [
+ {
+ name: 'Eloquent Relationships',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/laravel/eloquent-relationships.md',
+ },
+ {
+ name: 'One-to-Many Relationship',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/laravel/one-to-many-relationship.md',
+ },
+ {
+ name: 'Pivot Tables',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/laravel/pivot-tables.md',
+ },
+ ],
+ },
+ {
+ unit: 'Authentication',
+ chapters: [
+ {
+ name: 'Scaffold Authentication',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/laravel/scaffold-authentication.md',
+ },
+ {
+ name: 'Manual Authentication',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/laravel/manual-authentication.md',
+ },
+ ],
+ },
+ {
+ unit: 'View Composers and Archives',
+ chapters: [
+ {
+ name: 'Add Archives',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/laravel/add-archives.md',
+ },
+ {
+ name: 'View Composers',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/laravel/view-composers.md',
+ },
+ ],
+ },
+ {
+ unit: 'Testing & Seeding',
+ chapters: [
+ {
+ name: 'Testing',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/laravel/testing.md',
+ },
+ {
+ name: 'Seeding',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/laravel/seeding.md',
+ },
+ ],
+ },
+];
+
+const reactSyllabus = [
+ {
+ unit: 'Preface',
+ chapters: [
+ {
+ name: 'Choosing ReactJS',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/react/choosing-reactjs.md',
+ },
+ {
+ name: 'Prerequisites',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/react/prerequisites.md',
+ },
+ {
+ name: 'Philosophy',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/react/philosophy.md',
+ },
+ ],
+ },
+ {
+ unit: 'Getting Started',
+ chapters: [
+ {
+ name: 'Trying React',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/react/trying-react.md',
+ },
+ {
+ name: 'Create React App',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/react/create-react-app.md',
+ },
+ {
+ name: 'JavaScript XML Syntax',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/react/javascript-xml-syntax.md',
+ },
+ ],
+ },
+ {
+ unit: 'Components',
+ chapters: [
+ {
+ name: 'Custom Components',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/react/custom-components.md',
+ },
+ {
+ name: 'Rendering',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/react/rendering.md',
+ },
+ {
+ name: 'Conditional Rendering',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/react/conditional-rendering.md',
+ },
+ {
+ name: 'Data Flow',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/react/data-flow.md',
+ },
+ {
+ name: 'Lifecycle',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/react/lifecycle.md',
+ },
+ {
+ name: 'Events',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/react/events.md',
+ },
+ ],
+ },
+ {
+ unit: 'Forms',
+ chapters: [
+ {
+ name: 'Controlled Components',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/react/controlled-components.md',
+ },
+ {
+ name: 'Uncontrolled Components',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/react/uncontrolled-components.md',
+ },
+ ],
+ },
+ {
+ unit: 'Composition',
+ chapters: [
+ {
+ name: 'Lifting State Up',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/react/lifting-state-up.md',
+ },
+ {
+ name: 'Composition vs Inheritance',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/react/composition-vs-inheritance.md',
+ },
+ {
+ name: 'Context',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/react/context.md',
+ },
+ ],
+ },
+ {
+ unit: 'Tools',
+ chapters: [
+ {
+ name: 'Developer Tools',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/react/developer-tools.md',
+ },
+ {
+ name: 'Proptypes',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/react/proptypes.md',
+ },
+ {
+ name: 'Error Boundaries',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/react/error-boundaries.md',
+ },
+ ],
+ },
+ {
+ unit: 'In depth discussions',
+ chapters: [
+ {
+ name: 'JSX In Depth',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/react/jsx-in-depth.md',
+ },
+ {
+ name: 'Synthetic Events',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/react/synthetic-events.md',
+ },
+ {
+ name: 'React Without JSX',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/react/react-without-jsx.md',
+ },
+ {
+ name: 'React without ES6',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/react/react-without-es6.md',
+ },
+ {
+ name: 'Reconcilation Diff Algorithm',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/react/reconcilation---diff-algorithm.md',
+ },
+ ],
},
];
@@ -128,14 +419,33 @@ module.exports = {
'/space': { page: '/space' },
'/login': { page: '/login' },
};
+ const getSubject = subjectId => {
+ switch (subjectId) {
+ case 'laravel':
+ return laravelSyllabus;
+ case 'reactjs':
+ return reactSyllabus;
+ default:
+ return [];
+ }
+ };
for (const subject of listOfSubjects) {
- routes[subject.url] = {
- page: '/learn/subject',
- query: {
- id: subject.subjectId,
- },
- };
+ for (const unit of getSubject(subject.subjectId)) {
+ const chapters = unit.chapters;
+ for (const chapter of chapters) {
+ const chapterSlug = chapter.name.replace(/\s/gi, '-');
+ const route = `learn/${subject.subjectId}/${chapterSlug}`;
+ routes[route] = {
+ page: '/learn/subject',
+ query: {
+ subject: subject.subjectId,
+ chapter: chapterSlug,
+ },
+ };
+ }
+ }
}
+ console.log(routes);
return routes;
},
};
diff --git a/pages/index.js b/pages/index.js
index 95a4d878e..e36e07076 100644
--- a/pages/index.js
+++ b/pages/index.js
@@ -222,7 +222,7 @@ export default () => (
{take(listOfSubjects, 4).map(subject => {
- return ;
+ return ;
})}
diff --git a/pages/learn/subject.js b/pages/learn/subject.js
index 67694093a..54b9f21d7 100644
--- a/pages/learn/subject.js
+++ b/pages/learn/subject.js
@@ -1,4 +1,5 @@
import React from 'react';
+import Router from 'next/router';
import fetch from 'isomorphic-unfetch';
import styled from 'react-emotion';
import { space } from 'styled-system';
@@ -6,13 +7,13 @@ import { Flex, Box } from 'grid-emotion';
import ExpandTOC from 'react-icons/lib/fa/angle-double-right';
import CollapseTOC from 'react-icons/lib/fa/angle-double-left';
-import { baseContainer, Title, breakpoints } from '../../utils/base.styles';
+import { baseContainer, breakpoints } from '../../utils/base.styles';
import Layout from '../../components/common/layout';
import BannerSection from '../../components/learn/subject-banner';
import SyllabusTree from '../../components/learn/syllabus-tree/syllabus-tree-container';
import SubjectMarkdown from '../../components/learn/subject-marked';
-import { laravelSyllabus, reactSyllabus } from '../../utils/mock-data';
+import { laravelSyllabus, reactSyllabus, listOfSubjects } from '../../utils/mock-data';
const CurriculumSection = styled.section`
${baseContainer};
@@ -60,12 +61,9 @@ export default class Subject extends React.Component {
constructor(props) {
super(props);
this.state = {
- activeSubject: this.selectSubject(this.props.url.query.id),
+ activeSubject: this.selectSubject(this.props.url.query.subject),
activeChapterContent: '',
- activeChapterName:
- this.selectSubject(this.props.url.query.id) === null
- ? ''
- : this.selectSubject(this.props.url.query.id)[0].chapters[0].name,
+ activeChapterName: '',
loading: true,
isSidebarOpen: true,
};
@@ -81,24 +79,49 @@ export default class Subject extends React.Component {
return null;
}
}
+ selectChapter(syllabus, chapterName) {
+ return syllabus
+ .map(item => {
+ return item.chapters.find(chapter => chapter.name === chapterName);
+ })
+ .filter(Boolean)[0];
+ }
- componentDidMount() {
- if (this.state.activeSubject !== null) {
- const defaultChapter = this.state.activeSubject[0].chapters[0];
- this.getChapterContent(defaultChapter);
+ getChapter(subject, chapter) {
+ const activeSubject = this.selectSubject(subject);
+ const activeChapterName = chapter.replace(/-/gi, ' ');
+ if (activeSubject !== null) {
+ this.setState({
+ activeChapterName,
+ activeSubject,
+ });
+ const activeChapterUrl = this.selectChapter(activeSubject, activeChapterName).cdnUrl;
+ this.getChapterContent(activeChapterUrl);
}
}
+ componentDidMount() {
+ const { subject, chapter } = this.props.url.query;
+ this.getChapter(subject, chapter);
+ }
+
+ componentWillReceiveProps(nextProps) {
+ const { subject, chapter } = nextProps.url.query;
+ this.getChapter(subject, chapter);
+ }
+
changeChapter = selectedChapter => {
+ const subjectName = this.props.url.query.subject;
+ const chapterName = selectedChapter.name.replace(/\s/gi, '-');
+ Router.push(`/learn/subject?subject=${subjectName}&chapter=${chapterName}`, `/learn/${subjectName}/${chapterName}`);
+ };
+
+ async getChapterContent(chapterUrl) {
this.setState({
+ activeChapterContent: '',
loading: true,
- activeChapterName: selectedChapter.name,
});
- this.getChapterContent(selectedChapter);
- };
-
- async getChapterContent(chapter) {
- const activeChapterContentPromise = await fetch(chapter.url);
+ const activeChapterContentPromise = await fetch(chapterUrl);
const activeChapterContent = await activeChapterContentPromise.text();
await this.setState({
activeChapterContent,
@@ -107,18 +130,19 @@ export default class Subject extends React.Component {
}
render() {
+ const subject = listOfSubjects.find(item => item.subjectId === this.props.url.query.subject);
return this.state.activeSubject === null ? (
-
- Curriculum for {this.props.url.query.id} and others Coming soon!!
-
- ) : (
+
+ ) : (
+
+
{this.state.isSidebarOpen ? (
diff --git a/pages/login.js b/pages/login.js
index 0caf64ee2..5ea8d58ef 100644
--- a/pages/login.js
+++ b/pages/login.js
@@ -6,7 +6,7 @@ import BannerSection from '../components/common/banner';
export default () => {
return (
-
+
);
};
diff --git a/server.js b/server.js
index 8c9f73475..9811953e2 100644
--- a/server.js
+++ b/server.js
@@ -9,7 +9,7 @@ const dev = process.env.NODE_ENV !== 'production';
const app = next({ dev });
const handle = app.getRequestHandler();
const route = pathMatch();
-const match = route('/learn/:id');
+const match = route('/learn/:subject/:chapter');
getPort({ port: 3000 }).then(port => {
app.prepare().then(() => {
diff --git a/utils/mock-data.js b/utils/mock-data.js
index 5d6a0f4b3..43dee5c31 100644
--- a/utils/mock-data.js
+++ b/utils/mock-data.js
@@ -3,245 +3,242 @@ export const listOfSubjects = [
id: '2132',
title: 'Laravel',
domain: 'Web Development',
- url: '/learn/laravel',
+ path: '/learn/laravel/Choosing-laravel',
subjectId: 'laravel',
icon: 'devicon-laravel-plain colored',
learningCount: '20',
isGuideCompleted: true,
+ githubUrl: 'https://github.com/coderplex/learn/blob/master/web-dev/Backend/Learn-Laravel.md',
},
{
id: '213',
title: 'ReactJS',
domain: 'Web Development',
- url: '/learn/reactjs',
+ path: '/learn/reactjs/Choosing-ReactJS',
subjectId: 'reactjs',
icon: 'devicon-react-original colored',
learningCount: '28',
isGuideCompleted: true,
+ githubUrl:
+ 'https://github.com/coderplex/learn/blob/master/web-dev/Frontend/Libraries%20%26%20Frameworks/Learn-React.md',
},
{
id: '2131',
title: 'Go',
domain: 'Programming Language',
- url: '/learn/go',
+ path: '/learn/go',
subjectId: 'go',
icon: 'devicon-go-plain colored',
learningCount: '7',
isGuideCompleted: false,
+ githubUrl: 'https://github.com/coderplex/learn/blob/master/programming-languages/Go/learn-go.md',
},
{
id: '21fa3',
title: 'Android',
domain: 'Mobile Technology',
- url: '/learn/android',
+ path: '/learn/android',
subjectId: 'android',
icon: 'devicon-android-plain colored',
learningCount: '9',
isGuideCompleted: false,
+ githubUrl: 'https://github.com/coderplex/learn/blob/master/mobile-dev/Android/learn-android.md',
},
{
id: '21afasda3',
title: 'Rails',
domain: 'Backend Development',
- url: '/learn/rails',
+ path: '/learn/rails',
subjectId: 'rails',
icon: 'devicon-rails-plain colored',
learningCount: '14',
isGuideCompleted: false,
+ githubUrl: 'https://github.com/coderplex/learn/blob/master/web-dev/Backend/Learn-Rails.md',
},
{
id: '21wqerwqe3',
title: 'Python',
domain: 'Programming Language',
- url: '/learn/python',
+ path: '/learn/python',
subjectId: 'python',
icon: 'devicon-python-plain colored',
learningCount: '32',
isGuideCompleted: false,
+ githubUrl: 'https://github.com/coderplex/learn/tree/master/programming-languages/Python',
},
{
id: '2bxcvbx13',
title: 'iOS',
domain: 'Mobile Technology',
- url: '/learn/ios',
+ path: '/learn/ios',
subjectId: 'ios',
icon: 'devicon-swift-plain colored',
learningCount: '45',
isGuideCompleted: false,
+ githubUrl: 'https://github.com/coderplex/learn/blob/master/mobile-dev/iOS/Learn-iOS.md',
},
{
id: '2bxczzxcvbx13',
title: 'Javascript',
domain: 'Programming Language',
- url: '/learn/javascript',
+ path: '/learn/javascript',
subjectId: 'javascript',
icon: 'devicon-javascript-plain colored',
learningCount: '31',
isGuideCompleted: false,
+ githubUrl: 'https://github.com/coderplex/learn/blob/master/web-dev/Frontend/learn-intermediate.md',
},
{
id: '2bxdfasczzxcvbx13',
title: 'Angular',
domain: 'Frontend Development',
- url: '/learn/angular',
+ path: '/learn/angular',
subjectId: 'angular',
icon: 'devicon-angularjs-plain colored',
learningCount: '3',
isGuideCompleted: false,
+ githubUrl:
+ 'https://github.com/coderplex/learn/blob/master/web-dev/Frontend/Libraries%20%26%20Frameworks/Learn-Angular.md',
},
];
export const laravelSyllabus = [
{
- unit: {
- name: 'Preface',
- },
+ unit: 'Preface',
chapters: [
{
name: 'Choosing laravel',
- url: 'https://rawgit.com/coderplex/learn/cdn/laravel/choosing-laravel.md',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/laravel/choosing-laravel.md',
},
{
name: 'Prerequisites',
- url: 'https://rawgit.com/coderplex/learn/cdn/laravel/prerequisites.md',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/laravel/prerequisites.md',
},
{
name: 'Installation',
- url: 'https://rawgit.com/coderplex/learn/cdn/laravel/installation.md',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/laravel/installation.md',
},
],
},
{
- unit: {
- name: 'Models, Views, Controllers and Routes',
- },
+ unit: 'Models, Views, Controllers and Routes',
chapters: [
{
name: 'Introduction to MVC',
- url: 'https://rawgit.com/coderplex/learn/cdn/laravel/introduction-to-mvc.md',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/laravel/introduction-to-mvc.md',
},
{
name: 'Basic Routing and Views',
- url: 'https://rawgit.com/coderplex/learn/cdn/laravel/basic-routing-and-views.md',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/laravel/basic-routing-and-views.md',
},
{
name: 'Pass Data to Views',
- url: 'https://rawgit.com/coderplex/learn/cdn/laravel/pass-data-to-views.md',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/laravel/pass-data-to-views.md',
},
{
name: 'Database Setup',
- url: 'https://rawgit.com/coderplex/learn/cdn/laravel/database-setup.md',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/laravel/database-setup.md',
},
{
name: 'Working with Query Builder',
- url: 'https://rawgit.com/coderplex/learn/cdn/laravel/working-with-query-builder.md',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/laravel/working-with-query-builder.md',
},
{
name: 'Eloquent',
- url: 'https://rawgit.com/coderplex/learn/cdn/laravel/eloquent.md',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/laravel/eloquent.md',
},
{
name: 'Controllers',
- url: 'https://rawgit.com/coderplex/learn/cdn/laravel/controllers.md',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/laravel/controllers.md',
},
{
name: 'Route Model Binding',
- url: 'https://rawgit.com/coderplex/learn/cdn/laravel/route-model-binding.md',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/laravel/route-model-binding.md',
},
],
},
{
- unit: {
- name: 'Front-End',
- },
+ unit: 'Front-End',
chapters: [
{
name: 'Layouts and Structures',
- url: 'https://rawgit.com/coderplex/learn/cdn/laravel/layouts-and-structures.md',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/laravel/layouts-and-structures.md',
},
{
name: 'Form Requests and CSRF',
- url: 'https://rawgit.com/coderplex/learn/cdn/laravel/form-requests-and-CSRF.md',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/laravel/form-requests-and-CSRF.md',
},
{
name: 'Form Validation',
- url: 'https://rawgit.com/coderplex/learn/cdn/laravel/form-validation.md',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/laravel/form-validation.md',
},
{
name: 'Rendering',
- url: 'https://rawgit.com/coderplex/learn/cdn/laravel/rendering',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/laravel/rendering',
},
{
name: 'Laravel Mix',
- url: 'https://rawgit.com/coderplex/learn/cdn/laravel/laravel-mix.md',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/laravel/laravel-mix.md',
},
{
name: 'Flash Messaging',
- url: 'https://rawgit.com/coderplex/learn/cdn/laravel/flash-messaging.md',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/laravel/flash-messaging.md',
},
],
},
{
- unit: {
- name: 'Relationships',
- },
+ unit: 'Relationships',
chapters: [
{
name: 'Eloquent Relationships',
- url: 'https://rawgit.com/coderplex/learn/cdn/laravel/eloquent-relationships.md',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/laravel/eloquent-relationships.md',
},
{
name: 'One-to-Many Relationship',
- url: 'https://rawgit.com/coderplex/learn/cdn/laravel/one-to-many-relationship.md',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/laravel/one-to-many-relationship.md',
},
{
name: 'Pivot Tables',
- url: 'https://rawgit.com/coderplex/learn/cdn/laravel/pivot-tables.md',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/laravel/pivot-tables.md',
},
],
},
{
- unit: {
- name: 'Authentication',
- },
+ unit: 'Authentication',
chapters: [
{
name: 'Scaffold Authentication',
- url: 'https://rawgit.com/coderplex/learn/cdn/laravel/scaffold-authentication.md',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/laravel/scaffold-authentication.md',
},
{
name: 'Manual Authentication',
- url: 'https://rawgit.com/coderplex/learn/cdn/laravel/manual-authentication.md',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/laravel/manual-authentication.md',
},
],
},
{
- unit: {
- name: 'View Composers and Archives',
- },
+ unit: 'View Composers and Archives',
chapters: [
{
name: 'Add Archives',
- url: 'https://rawgit.com/coderplex/learn/cdn/laravel/add-archives.md',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/laravel/add-archives.md',
},
{
name: 'View Composers',
- url: 'https://rawgit.com/coderplex/learn/cdn/laravel/view-composers.md',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/laravel/view-composers.md',
},
],
},
{
- unit: {
- name: 'Testing & Seeding',
- },
+ unit: 'Testing & Seeding',
chapters: [
{
name: 'Testing',
- url: 'https://rawgit.com/coderplex/learn/cdn/laravel/testing.md',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/laravel/testing.md',
},
{
name: 'Seeding',
- url: 'https://rawgit.com/coderplex/learn/cdn/laravel/seeding.md',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/laravel/seeding.md',
},
],
},
@@ -249,151 +246,137 @@ export const laravelSyllabus = [
export const reactSyllabus = [
{
- unit: {
- name: 'Preface',
- },
+ unit: 'Preface',
chapters: [
{
name: 'Choosing ReactJS',
- url: 'https://rawgit.com/coderplex/learn/cdn/react/choosing-reactjs.md',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/react/choosing-reactjs.md',
},
{
name: 'Prerequisites',
- url: 'https://rawgit.com/coderplex/learn/cdn/react/prerequisites.md',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/react/prerequisites.md',
},
{
name: 'Philosophy',
- url: 'https://rawgit.com/coderplex/learn/cdn/react/philosophy.md',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/react/philosophy.md',
},
],
},
{
- unit: {
- name: 'Getting Started',
- },
+ unit: 'Getting Started',
chapters: [
{
name: 'Trying React',
- url: 'https://rawgit.com/coderplex/learn/cdn/react/trying-react.md',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/react/trying-react.md',
},
{
name: 'Create React App',
- url: 'https://rawgit.com/coderplex/learn/cdn/react/create-react-app.md',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/react/create-react-app.md',
},
{
name: 'JavaScript XML Syntax',
- url: 'https://rawgit.com/coderplex/learn/cdn/react/javascript-xml-syntax.md',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/react/javascript-xml-syntax.md',
},
],
},
{
- unit: {
- name: 'Components',
- },
+ unit: 'Components',
chapters: [
{
name: 'Custom Components',
- url: 'https://rawgit.com/coderplex/learn/cdn/react/custom-components.md',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/react/custom-components.md',
},
{
name: 'Rendering',
- url: 'https://rawgit.com/coderplex/learn/cdn/react/rendering.md',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/react/rendering.md',
},
{
name: 'Conditional Rendering',
- url: 'https://rawgit.com/coderplex/learn/cdn/react/conditional-rendering.md',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/react/conditional-rendering.md',
},
{
name: 'Data Flow',
- url: 'https://rawgit.com/coderplex/learn/cdn/react/data-flow.md',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/react/data-flow.md',
},
{
name: 'Lifecycle',
- url: 'https://rawgit.com/coderplex/learn/cdn/react/lifecycle.md',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/react/lifecycle.md',
},
{
name: 'Events',
- url: 'https://rawgit.com/coderplex/learn/cdn/react/events.md',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/react/events.md',
},
],
},
{
- unit: {
- name: 'Forms',
- },
+ unit: 'Forms',
chapters: [
{
name: 'Controlled Components',
- url: 'https://rawgit.com/coderplex/learn/cdn/react/controlled-components.md',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/react/controlled-components.md',
},
{
name: 'Uncontrolled Components',
- url: 'https://rawgit.com/coderplex/learn/cdn/react/uncontrolled-components.md',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/react/uncontrolled-components.md',
},
],
},
{
- unit: {
- name: 'Composition',
- },
+ unit: 'Composition',
chapters: [
{
name: 'Lifting State Up',
- url: 'https://rawgit.com/coderplex/learn/cdn/react/lifting-state-up.md',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/react/lifting-state-up.md',
},
{
name: 'Composition vs Inheritance',
- url: 'https://rawgit.com/coderplex/learn/cdn/react/composition-vs-inheritance.md',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/react/composition-vs-inheritance.md',
},
{
name: 'Context',
- url: 'https://rawgit.com/coderplex/learn/cdn/react/context.md',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/react/context.md',
},
],
},
{
- unit: {
- name: 'Tools',
- },
+ unit: 'Tools',
chapters: [
{
name: 'Developer Tools',
- url: 'https://rawgit.com/coderplex/learn/cdn/react/developer-tools.md',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/react/developer-tools.md',
},
{
name: 'Proptypes',
- url: 'https://rawgit.com/coderplex/learn/cdn/react/proptypes.md',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/react/proptypes.md',
},
{
name: 'Error Boundaries',
- url: 'https://rawgit.com/coderplex/learn/cdn/react/error-boundaries.md',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/react/error-boundaries.md',
},
],
},
{
- unit: {
- name: 'In depth discussions',
- },
+ unit: 'In depth discussions',
chapters: [
{
name: 'JSX In Depth',
- url: 'https://rawgit.com/coderplex/learn/cdn/react/jsx-in-depth.md',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/react/jsx-in-depth.md',
},
{
name: 'Synthetic Events',
- url: 'https://rawgit.com/coderplex/learn/cdn/react/synthetic-events.md',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/react/synthetic-events.md',
},
{
name: 'React Without JSX',
- url: 'https://rawgit.com/coderplex/learn/cdn/react/react-without-jsx.md',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/react/react-without-jsx.md',
},
{
name: 'React without ES6',
- url: 'https://rawgit.com/coderplex/learn/cdn/react/react-without-es6.md',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/react/react-without-es6.md',
},
{
- name: 'Reconcilation - Diff Algorithm',
- url: 'https://rawgit.com/coderplex/learn/cdn/react/reconcilation---diff-algorithm.md',
+ name: 'Reconcilation Diff Algorithm',
+ cdnUrl: 'https://rawgit.com/coderplex/learn/cdn/react/reconcilation---diff-algorithm.md',
},
],
},
pFad - Phonifier reborn
Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.
Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.
Alternative Proxies:
Alternative Proxy
pFad Proxy
pFad v3 Proxy
pFad v4 Proxy