Getting Started

Welcome to the Frontend Freaks Documentation.


Here you should find everything you need from getting started with creating content.

Understanding the folder structure

For writing you may primarly be working on ./content folder. The batch/index.mdx files give the structure for docs page.

  • /batch/learn - Specify learn batch

Naming convention is upto to you just make sure there are no spaces between name

The example of learn batch which has 4 pages and each has some more pages.

batch/learn/
├── index.mdx - the intro page
├── html - folder
├── github - folder
├── css - folder
└── js - folder

If you want to add new page to learn css page let's say layouts you can add a new folder to ./content/learn/css, For example

batch/learn/css/
├── index.mdx - the intro page
├── page1.mdx
├── page2.mdx
└── page3.mdx

There is no limit to number of pages, so write as much you want

Add Content to .MDX files

Add content Using React components in Markdown using MDX.

    ---
 
title: Getting Started
description: Welcome to the Documentation.
 
---
        Write anything to want using the MDX components

Make sure to add a title and description to .mdx files either they won't work

As the content is generated now the only remaining part is to show it

  • Go to .config/sidebar.ts
  • Add the links to Newly generated content
...
 sidebarNav: [
    {
      title: "Getting Started",
      items: [
        {
          title: "Introduction",
          href: "/batch",
        },
      ],
    },
    {
      title: "Learn",
      items: [
        {
          title: "Html",
          items: [
            {
              title: "basic",
              href: "/batch/learn/html/basic",
            },
             {
              title: "new page",
              href: "/batch/learn/html/new-page",
            },
          ],
        },
       ...
      ],
    },
   ...
  • Links without topic name go to index.mdx in that folder
  • batch/learn reffer to .content/batch/learn/index.mdx
  • batch/learn/html/topic-name reffers to .content/batch/learn/html/topic-name.mdx

Congrats You made it to the end

Now Raise a pull request Lets other people feedback on it

Image

Reffer to the links below for understanding the flow of content

This is not the only structure or flow for writing content you can write however you want using the components provide here also you can make custom components as you like.

Image

Learn

Learn HTML, CSS, JS and Git & Github

View
Image

DSA in Javascript

Learn data structures and algorithms in JavaScript

View
Image

Build

Master React, Redux and Next Js

View
Image

Hire

Get Interview Tips and Tricks

View