# README

## Hi 👋, I'm Bryan

***

![](https://komarev.com/ghpvc/?username=bgoonz)

## [WEBSITE](https://bgoonz-blog.netlify.app/)

## Search Website: [search](https://www.algolia.com/realtime-search-demo/web-dev-resource-hub-9e6b8aa8-6106-44c5-9f59-ff3f9531abd4)

### [Backup Repo Deploy](https://bgoonzblog20-backup.netlify.app/#gsc.tab=0)

### [Github pages](https://bgoonz.github.io/BGOONZ_BLOG_2.0/)

![Profile views](https://views.whatilearened.today/views/github/bgoonz/views.svg)[![Gitter](https://badges.gitter.im/bgoonz/community.svg)](https://gitter.im/bgoonz/community?utm_source=badge\&utm_medium=badge\&utm_campaign=pr-badge)

[![Netlify Status](https://api.netlify.com/api/v1/badges/a1b7ee1a-11a7-4bd2-a341-2260656e216f/deploy-status)](https://app.netlify.com/sites/best-celery-b2d7c/deploys)

[![CodeScene System Mastery](https://codescene.io/projects/17026/status-badges/system-mastery)](https://codescene.io/projects/17026)

![Demo](https://github.com/bgoonz/BGOONZ_BLOG_2.0/blob/master/static/images/iframes.gif?raw=true)

## Homepage

## Technologies used

### [Global Site Tag](https://trends.builtwith.com/analytics/Global-Site-Tag)

[Global Site Tag Usage Statistics](https://trends.builtwith.com/analytics/Global-Site-Tag) - [Download List of All Websites using Global Site Tag](https://trends.builtwith.com/websitelist/Global-Site-Tag)

Google's primary tag for Google Measurement/Conversion Tracking, Adwords and DoubleClick.

### [Google Analytics](https://trends.builtwith.com/analytics/Google-Analytics)

[Google Analytics Usage Statistics](https://trends.builtwith.com/analytics/Google-Analytics) - [Download List of All Websites using Google Analytics](https://trends.builtwith.com/websitelist/Google-Analytics)

Google Analytics offers a host of compelling features and benefits for everyone from senior executives and advertising and marketing professionals to site owners and content developers.

[Application Performance](https://trends.builtwith.com/analytics/application-performance) - [Audience Measurement](https://trends.builtwith.com/analytics/audience-measurement) - [Visitor Count Tracking](https://trends.builtwith.com/analytics/visitor-count-tracking)

[**Google Analytics 4**](https://trends.builtwith.com/analytics/Google-Analytics-4)

[Google Analytics 4 Usage Statistics](https://trends.builtwith.com/analytics/Google-Analytics-4) - [Download List of All Websites using Google Analytics 4](https://trends.builtwith.com/websitelist/Google-Analytics-4)

Google Analytics 4 formerly known as App + Web is a new version of Google Analytics that was released in October 2020.

**Widgets**

[View Global Trends](https://trends.builtwith.com/widgets)

### [Imgur](https://trends.builtwith.com/widgets/Imgur)

[Imgur Usage Statistics](https://trends.builtwith.com/widgets/Imgur) - [Download List of All Websites using Imgur](https://trends.builtwith.com/websitelist/Imgur)

The page contains content from image sharing website imgur.

### [Google Font API](https://trends.builtwith.com/widgets/Google-Font-API)

[Google Font API Usage Statistics](https://trends.builtwith.com/widgets/Google-Font-API) - [Download List of All Websites using Google Font API](https://trends.builtwith.com/websitelist/Google-Font-API)

The Google Font API helps you add web fonts to any web page.

[Fonts](https://trends.builtwith.com/widgets/fonts)

### [Google Tag Manager](https://trends.builtwith.com/widgets/Google-Tag-Manager)

[Google Tag Manager Usage Statistics](https://trends.builtwith.com/widgets/Google-Tag-Manager) - [Download List of All Websites using Google Tag Manager](https://trends.builtwith.com/websitelist/Google-Tag-Manager)

Tag management that lets you add and update website tags without changes to underlying website code.

[Tag Management](https://trends.builtwith.com/widgets/tag-management)

### [Icons8](https://trends.builtwith.com/widgets/Icons8)

[Icons8 Usage Statistics](https://trends.builtwith.com/widgets/Icons8) - [Download List of All Websites using Icons8](https://trends.builtwith.com/websitelist/Icons8)

Icons, photos and illustrations.

[Image Provider](https://trends.builtwith.com/widgets/image-provider)

### [Lorem Ipsum](https://trends.builtwith.com/widgets/Lorem-Ipsum)

[Lorem Ipsum Usage Statistics](https://trends.builtwith.com/widgets/Lorem-Ipsum) - [Download List of All Websites using Lorem Ipsum](https://trends.builtwith.com/websitelist/Lorem-Ipsum)

This website contains the phrase 'lorem ipsum' which means it may have placeholder text.

### [AddThis](https://trends.builtwith.com/widgets/AddThis)

[AddThis Usage Statistics](https://trends.builtwith.com/widgets/AddThis) - [Download List of All Websites using AddThis](https://trends.builtwith.com/websitelist/AddThis)

Widgets that allow visitors to save and promote the site.

[Social Sharing](https://trends.builtwith.com/widgets/social-sharing) - [Bookmarking](https://trends.builtwith.com/widgets/bookmarking)

### [tawk.to](https://trends.builtwith.com/widgets/tawk.to)

[tawk.to Usage Statistics](https://trends.builtwith.com/widgets/tawk.to) - [Download List of All Websites using tawk.to](https://trends.builtwith.com/websitelist/tawk.to)

tawk.to is a free live chat app that lets you monitor and chat with visitors.

[Live Chat](https://trends.builtwith.com/widgets/live-chat)

**Frameworks**

[View Global Trends](https://trends.builtwith.com/framework)

### [Gatsby JS](https://trends.builtwith.com/framework/Gatsby-JS)

[Gatsby JS Usage Statistics](https://trends.builtwith.com/framework/Gatsby-JS) - [Download List of All Websites using Gatsby JS](https://trends.builtwith.com/websitelist/Gatsby-JS)

Modern website and web apps generator for React.

**Mobile**

[View Global Trends](https://trends.builtwith.com/mobile)

### [Viewport Meta](https://trends.builtwith.com/mobile/Viewport-Meta)

[Viewport Meta Usage Statistics](https://trends.builtwith.com/mobile/Viewport-Meta) - [Download List of All Websites using Viewport Meta](https://trends.builtwith.com/websitelist/Viewport-Meta)

This page uses the viewport meta tag which means the content may be optimized for mobile content.

### [IPhone / Mobile Compatible](https://trends.builtwith.com/mobile/IPhone---Mobile-Compatible)

[IPhone / Mobile Compatible Usage Statistics](https://trends.builtwith.com/mobile/IPhone---Mobile-Compatible) - [Download List of All Websites using IPhone / Mobile Compatible](https://trends.builtwith.com/websitelist/IPhone---Mobile-Compatible)

The website contains code that allows the page to support IPhone / Mobile Content.

### [Apple Mobile Web Clips Icon](https://trends.builtwith.com/mobile/Apple-Mobile-Web-Clips-Icon)

[Apple Mobile Web Clips Icon Usage Statistics](https://trends.builtwith.com/mobile/Apple-Mobile-Web-Clips-Icon) - [Download List of All Websites using Apple Mobile Web Clips Icon](https://trends.builtwith.com/websitelist/Apple-Mobile-Web-Clips-Icon)

This page contains an icon for iPhone, iPad and iTouch devices.

**Content Delivery Network**

[View Global Trends](https://trends.builtwith.com/cdn)

### [AJAX Libraries API](https://trends.builtwith.com/cdn/AJAX-Libraries-API)

[AJAX Libraries API Usage Statistics](https://trends.builtwith.com/cdn/AJAX-Libraries-API) - [Download List of All Websites using AJAX Libraries API](https://trends.builtwith.com/websitelist/AJAX-Libraries-API)

The AJAX Libraries API is a content distribution network and loading architecture for the most popular, open source JavaScript libraries.

### [jsDelivr](https://trends.builtwith.com/cdn/jsDelivr)

[jsDelivr Usage Statistics](https://trends.builtwith.com/cdn/jsDelivr) - [Download List of All Websites using jsDelivr](https://trends.builtwith.com/websitelist/jsDelivr)

A free CDN where Javascript developers can host their files. Encompasses MaxCDN, and BootstrapCDN.

### [CloudFront](https://trends.builtwith.com/cdn/CloudFront)

[CloudFront Usage Statistics](https://trends.builtwith.com/cdn/CloudFront) - [Download List of All Websites using CloudFront](https://trends.builtwith.com/websitelist/CloudFront)

Amazon CloudFront is a web service for content delivery. It integrates with other Amazon Web Services to give developers and businesses an easy way to distribute content to end users with low latency, high data transfer speeds, and no commitments.

**Content Management System**

[View Global Trends](https://trends.builtwith.com/cms)

### [Netlify](https://trends.builtwith.com/cms/Netlify)

[Netlify Usage Statistics](https://trends.builtwith.com/cms/Netlify) - [Download List of All Websites using Netlify](https://trends.builtwith.com/websitelist/Netlify)

Netlify is a platform that automates your code to create web sites.

**JavaScript Libraries and Functions**

[View Global Trends](https://trends.builtwith.com/javascript)

### [Google Hosted Libraries](https://trends.builtwith.com/javascript/Google-Hosted-Libraries)

[Google Hosted Libraries Usage Statistics](https://trends.builtwith.com/javascript/Google-Hosted-Libraries) - [Download List of All Websites using Google Hosted Libraries](https://trends.builtwith.com/websitelist/Google-Hosted-Libraries)

Google Hosted Libraries is a globally available content distribution network for the most popular, open-source JavaScript libraries.

[**Google Hosted jQuery**](https://trends.builtwith.com/javascript/Google-Hosted-jQuery)

[Google Hosted jQuery Usage Statistics](https://trends.builtwith.com/javascript/Google-Hosted-jQuery) - [Download List of All Websites using Google Hosted jQuery](https://trends.builtwith.com/websitelist/Google-Hosted-jQuery)

jQuery hoted at Google.

**Advertising**

[View Global Trends](https://trends.builtwith.com/ads)

### [Google Adsense](https://trends.builtwith.com/ads/Google-Adsense)

[Google Adsense Usage Statistics](https://trends.builtwith.com/ads/Google-Adsense) - [Download List of All Websites using Google Adsense](https://trends.builtwith.com/websitelist/Google-Adsense)

A contextual advertising solution for delivering Google AdWords ads that are relevant to site content pages.

[Contextual Advertising](https://trends.builtwith.com/ads/contextual-advertising)

[**Google Adsense Asynchronous**](https://trends.builtwith.com/ads/Google-Adsense-Asynchronous)

[Google Adsense Asynchronous Usage Statistics](https://trends.builtwith.com/ads/Google-Adsense-Asynchronous) - [Download List of All Websites using Google Adsense Asynchronous](https://trends.builtwith.com/websitelist/Google-Adsense-Asynchronous)

Fully asynchronous version of the AdSense ad code.

**Document Encoding**

[View Global Trends](https://trends.builtwith.com/encoding)

### [UTF-8](https://trends.builtwith.com/encoding/UTF-8)

[UTF-8 Usage Statistics](https://trends.builtwith.com/encoding/UTF-8) - [Download List of All Websites using UTF-8](https://trends.builtwith.com/websitelist/UTF-8)

UTF-8 (8-bit UCS/Unicode Transformation Format) is a variable-length character encoding for Unicode. It is the preferred encoding for web pages.

**Document Standards**

[View Global Trends](https://trends.builtwith.com/docinfo)

### [HTML5 DocType](https://trends.builtwith.com/docinfo/HTML5-DocType)

[HTML5 DocType Usage Statistics](https://trends.builtwith.com/docinfo/HTML5-DocType) - [Download List of All Websites using HTML5 DocType](https://trends.builtwith.com/websitelist/HTML5-DocType)

The DOCTYPE is a required preamble for HTML5 websites.

### [Cascading Style Sheets](https://trends.builtwith.com/docinfo/Cascading-Style-Sheets)

[Cascading Style Sheets Usage Statistics](https://trends.builtwith.com/docinfo/Cascading-Style-Sheets) - [Download List of All Websites using Cascading Style Sheets](https://trends.builtwith.com/websitelist/Cascading-Style-Sheets)

Cascading Style Sheets (CSS) is a stylesheet language used to describe the presentation of a document written in a markup language. Its most common application is to style web pages written in HTML

### [Open Graph Protocol](https://trends.builtwith.com/docinfo/Open-Graph-Protocol)

[Open Graph Protocol Usage Statistics](https://trends.builtwith.com/docinfo/Open-Graph-Protocol) - [Download List of All Websites using Open Graph Protocol](https://trends.builtwith.com/websitelist/Open-Graph-Protocol)

The Open Graph protocol enables any web page to become a rich object in a social graph, a open protocol supported by Facebook

### [Twitter Cards](https://trends.builtwith.com/docinfo/Twitter-Cards)

[Twitter Cards Usage Statistics](https://trends.builtwith.com/docinfo/Twitter-Cards) - [Download List of All Websites using Twitter Cards](https://trends.builtwith.com/websitelist/Twitter-Cards)

Twitter cards make it possible for you to attach media experiences to Tweets that link to your content.

### [Javascript](https://trends.builtwith.com/docinfo/Javascript)

[Javascript Usage Statistics](https://trends.builtwith.com/docinfo/Javascript) - [Download List of All Websites using Javascript](https://trends.builtwith.com/websitelist/Javascript)

JavaScript is a scripting language most often used for client-side web development.

### [IFrame](https://trends.builtwith.com/docinfo/IFrame)

[IFrame Usage Statistics](https://trends.builtwith.com/docinfo/IFrame) - [Download List of All Websites using IFrame](https://trends.builtwith.com/websitelist/IFrame)

The page shows content with an iframe; an embedded frame that loads another webpage.

### [Font Face Rule](https://trends.builtwith.com/docinfo/Font-Face-Rule)

[Font Face Rule Usage Statistics](https://trends.builtwith.com/docinfo/Font-Face-Rule) - [Download List of All Websites using Font Face Rule](https://trends.builtwith.com/websitelist/Font-Face-Rule)

The @font-face rule allows for linking to fonts that are automatically activated when needed.

### [X-UA-Compatible](https://trends.builtwith.com/docinfo/X-UA-Compatible)

[X-UA-Compatible Usage Statistics](https://trends.builtwith.com/docinfo/X-UA-Compatible) - [Download List of All Websites using X-UA-Compatible](https://trends.builtwith.com/websitelist/X-UA-Compatible)

Allows a website to define how a page is rendered in Internet Explorer 8, allowing a website to decide to use IE7 style rendering over IE8 rendering.

### [Meta Keywords](https://trends.builtwith.com/docinfo/Meta-Keywords)

[Meta Keywords Usage Statistics](https://trends.builtwith.com/docinfo/Meta-Keywords) - [Download List of All Websites using Meta Keywords](https://trends.builtwith.com/websitelist/Meta-Keywords)

Meta tag containing keywords related to the page.

### [Meta Description](https://trends.builtwith.com/docinfo/Meta-Description)

[Meta Description Usage Statistics](https://trends.builtwith.com/docinfo/Meta-Description) - [Download List of All Websites using Meta Description](https://trends.builtwith.com/websitelist/Meta-Description)

The description attribute provides a concise explanation of the page content.

### [HTML 5 Specific Tags](https://trends.builtwith.com/docinfo/HTML-5-Specific-Tags)

[HTML 5 Specific Tags Usage Statistics](https://trends.builtwith.com/docinfo/HTML-5-Specific-Tags) - [Download List of All Websites using HTML 5 Specific Tags](https://trends.builtwith.com/websitelist/HTML-5-Specific-Tags)

This page contains tags that are specific to an HTML 5 implementation.

### [WAI-ARIA](https://trends.builtwith.com/docinfo/WAI-ARIA)

[WAI-ARIA Usage Statistics](https://trends.builtwith.com/docinfo/WAI-ARIA) - [Download List of All Websites using WAI-ARIA](https://trends.builtwith.com/websitelist/WAI-ARIA)

A way to make Web content and Web applications more accessible to people with disabilities. It especially helps with dynamic content and advanced user interface controls developed with Ajax, HTML, JavaScript, and related technologies.

### [Strict Transport Security](https://trends.builtwith.com/docinfo/Strict-Transport-Security)

[Strict Transport Security Usage Statistics](https://trends.builtwith.com/docinfo/Strict-Transport-Security) - [Download List of All Websites using Strict Transport Security](https://trends.builtwith.com/websitelist/Strict-Transport-Security)

The HTTP Strict-Transport-Security (HSTS) header instructs the browser to only use https.

### [HSTS](https://trends.builtwith.com/docinfo/HSTS)

[HSTS Usage Statistics](https://trends.builtwith.com/docinfo/HSTS) - [Download List of All Websites using HSTS](https://trends.builtwith.com/websitelist/HSTS)

Forces browsers to only communicate with the site using HTTPS.

### [HSTS IncludeSubdomains PreLoad](https://trends.builtwith.com/docinfo/HSTS-IncludeSubdomains-PreLoad)

[HSTS IncludeSubdomains PreLoad Usage Statistics](https://trends.builtwith.com/docinfo/HSTS-IncludeSubdomains-PreLoad) - [Download List of All Websites using HSTS IncludeSubdomains PreLoad](https://trends.builtwith.com/websitelist/HSTS-IncludeSubdomains-PreLoad)

This website includes instructions for HSTS loading that would allow it to be submitted to the HSTS preload list.

**Web Master Registration**

[View Global Trends](https://trends.builtwith.com/web-master)

### [Google Webmaster](https://trends.builtwith.com/Web-Master/Google-Webmaster)

[Google Webmaster Usage Statistics](https://trends.builtwith.com/Web-Master/Google-Webmaster) - [Download List of All Websites using Google Webmaster](https://trends.builtwith.com/websitelist/Google-Webmaster)

Webmaster tools provide you with a free and easy way to make your site more Google-friendly.

**Content Delivery Network**

[View Global Trends](https://trends.builtwith.com/cdn)

### [Content Delivery Network](https://trends.builtwith.com/CDN/Content-Delivery-Network)

[Content Delivery Network Usage Statistics](https://trends.builtwith.com/CDN/Content-Delivery-Network) - [Download List of All Websites using Content Delivery Network](https://trends.builtwith.com/websitelist/Content-Delivery-Network)

This page contains links that give the impression that some of the site contents are stored on a content delivery network.

### Docs Structure

```

.

├── ./About

│   ├── ./About/index.md

│   ├── ./About/introduction2bg.md

│   ├── ./About/me.md

│   └── ./About/resume.md

├── ./articles

│   ├── ./articles/algo.md

│   └── ./articles/basic-web-dev.md

├── ./faq

│   ├── ./faq/Contact.md

│   ├── ./faq/index.md

│   └── ./faq/other-sites.md

├── ./index.md

├── ./jupyter-notebooks.md

├── ./links

│   ├── ./links/Social.md

│   ├── ./links/index.md

│   └── ./links/my-websites.md

├── ./portfolio-web.md

├── ./python.md

├── ./quick-reference

│   ├── ./quick-reference/Emmet.md

│   ├── ./quick-reference/index.md

│   ├── ./quick-reference/installation.md

│   └── ./quick-reference/new-repo-instructions.md

├── ./react

│   ├── ./react/createReactApp.md

│   ├── ./react/index.md

│   └── ./react/react2.md

├── ./resources.md

└── ./tools

    ├── ./tools/Git-Html-Preview.md

    ├── ./tools/default-readme.md

    ├── ./tools/index.md

    ├── ./tools/notes-template.md

    └── ./tools/plug-ins.md



7 directories, 29 files




```

***

## Sitemap

* [/job-hunt/](https://bgoonz-blog.netlify.app/job-hunt/)
* [/notes-template/](https://bgoonz-blog.netlify.app/notes-template/)
* [/](https://bgoonz-blog.netlify.app/)
* [/showcase/](https://bgoonz-blog.netlify.app/showcase/)
* [/blog/](https://bgoonz-blog.netlify.app/blog/)
* [/review/](https://bgoonz-blog.netlify.app/review/)
* [/blog/blog-archive/](https://bgoonz-blog.netlify.app/blog/blog-archive/)
* [/blog/my-medium/](https://bgoonz-blog.netlify.app/blog/my-medium/)
* [/blog/blogwcomments/](https://bgoonz-blog.netlify.app/blog/blogwcomments/)
* [/blog/data-structures/](https://bgoonz-blog.netlify.app/blog/data-structures/)
* [/docs/gallery/](https://bgoonz-blog.netlify.app/docs/gallery/)
* [/blog/python-for-js-dev/](https://bgoonz-blog.netlify.app/blog/python-for-js-dev/)
* [/blog/platform-docs/](https://bgoonz-blog.netlify.app/blog/platform-docs/)
* [/docs/sitemap/](https://bgoonz-blog.netlify.app/docs/sitemap/)
* [/docs/about/me/](https://bgoonz-blog.netlify.app/docs/about/me/)
* [/blog/python-resources/](https://bgoonz-blog.netlify.app/blog/python-resources/)
* [/docs/about/resume/](https://bgoonz-blog.netlify.app/docs/about/resume/)
* [/docs/](https://preview--bgoonz-b2d7c.stackbit.https://bgoonz-blog.netlify.app/log/web-scraping/)
* [/docs/about/](https://bgoonz-blog.netlify.app/docs/about/)
* [/docs/articles/algo/](https://bgoonz-blog.netlify.app/docs/articles/algo/)
* [/docs/articles/install/](https://bgoonz-blog.netlify.app/docs/articles/install/)
* [/docs/articles/](https://bgoonz-blog.netlify.app/docs/articles/)
* [/docs/articles/gallery/](https://bgoonz-blog.netlify.app/docs/articles/gallery/)
* [/docs/articles/intro/](https://bgoonz-blog.netlify.app/docs/articles/intro/)
* [/docs/articles/basic-web-dev/](https://bgoonz-blog.netlify.app/docs/articles/basic-web-dev/)
* [/docs/articles/reading-files/](https://bgoonz-blog.netlify.app/docs/articles/reading-files/)
* [/docs/articles/writing-files/](https://bgoonz-blog.netlify.app/docs/articles/writing-files/)
* [/docs/audio/audio/](https://bgoonz-blog.netlify.app/docs/audio/audio/)
* [/docs/content/projects/](https://bgoonz-blog.netlify.app/docs/content/projects/)
* [/docs/audio/terms/](https://bgoonz-blog.netlify.app/docs/audio/terms/)
* [/docs/faq/](https://bgoonz-blog.netlify.app/docs/faq/)
* [/docs/community/](https://bgoonz-blog.netlify.app/docs/community/)
* [/docs/articles/resources/](https://bgoonz-blog.netlify.app/docs/articles/resources/)
* [/docs/content/](https://bgoonz-blog.netlify.app/docs/content/)
* [/docs/docs/git-repos/](https://bgoonz-blog.netlify.app/docs/docs/git-repos/)
* [/docs/content/trouble-shooting/](https://bgoonz-blog.netlify.app/docs/content/trouble-shooting/)
* [/docs/articles/python/](https://bgoonz-blog.netlify.app/docs/articles/python/)
* [/docs/interact/clock/](https://bgoonz-blog.netlify.app/docs/interact/clock/)
* [/docs/docs/python/](https://bgoonz-blog.netlify.app/docs/docs/python/)
* [/docs/interact/jupyter-notebooks/](https://bgoonz-blog.netlify.app/docs/interact/jupyter-notebooks/)
* [/docs/interact/](https://bgoonz-blog.netlify.app/docs/interact/)
* [/docs/faq/contact/](https://bgoonz-blog.netlify.app/docs/faq/contact/)
* [/docs/quick-reference/docs/](https://bgoonz-blog.netlify.app/docs/quick-reference/docs/)
* [/docs/interact/other-sites/](https://bgoonz-blog.netlify.app/docs/interact/other-sites/)
* [/docs/quick-reference/new-repo-instructions/](https://bgoonz-blog.netlify.app/docs/quick-reference/new-repo-instructions/)
* [/docs/quick-reference/Emmet/](https://bgoonz-blog.netlify.app/docs/quick-reference/Emmet/)
* [/docs/quick-reference/installation/](https://bgoonz-blog.netlify.app/docs/quick-reference/installation/)
* [/docs/quick-reference/vscode-themes/](https://bgoonz-blog.netlify.app/docs/quick-reference/vscode-themes/)
* [/docs/react/createReactApp/](https://bgoonz-blog.netlify.app/docs/react/createReactApp/)
* [/docs/react/react2/](https://bgoonz-blog.netlify.app/docs/react/react2/)
* [/docs/quick-reference/](https://bgoonz-blog.netlify.app/docs/quick-reference/)
* [/docs/react/](https://bgoonz-blog.netlify.app/docs/react/)
* [/docs/tools/](https://bgoonz-blog.netlify.app/docs/tools/)
* [/docs/tools/notes-template/](https://bgoonz-blog.netlify.app/docs/tools/notes-template/)
* [/docs/tools/more-tools/](https://bgoonz-blog.netlify.app/docs/tools/more-tools/)
* [/docs/tools/plug-ins/](https://bgoonz-blog.netlify.app/docs/tools/plug-ins/)
* [/docs/articles/node/install/](https://bgoonz-blog.netlify.app/docs/articles/node/install/)
* [/docs/tools/vscode/](https://bgoonz-blog.netlify.app/docs/tools/vscode/)
* [/docs/articles/node/intro/](https://bgoonz-blog.netlify.app/docs/articles/node/intro/)
* [/docs/articles/node/nodejs/](https://bgoonz-blog.netlify.app/docs/articles/node/nodejs/)
* [/docs/articles/node/nodevsbrowser/](https://bgoonz-blog.netlify.app/docs/articles/node/nodevsbrowser/)
* [/docs/articles/node/npm/](https://bgoonz-blog.netlify.app/docs/articles/node/npm/)
* [/docs/articles/node/reading-files/](https://bgoonz-blog.netlify.app/docs/articles/node/reading-files/)
* [/docs/articles/node/writing-files/](https://bgoonz-blog.netlify.app/docs/articles/node/writing-files/)
* [/docs/react-in-depth/](https://bgoonz-blog.netlify.app/docs/react-in-depth/)
* [/docs/articles/article-compilation/](https://bgoonz-blog.netlify.app/docs/articles/article-compilation/)
* [/docs/medium/my-websites/](https://bgoonz-blog.netlify.app/docs/medium/my-websites/)
* [/docs/medium/social/](https://bgoonz-blog.netlify.app/docs/medium/social/)
* [/docs/medium/medium-links/](https://bgoonz-blog.netlify.app/docs/medium/medium-links/)
* [/docs/medium/](https://bgoonz-blog.netlify.app/docs/medium/)

## Sitemap

***

* [/blog/big-o-complexity/](https://bgoonz-blog.netlify.app/blog/big-o-complexity/)
* [/showcase/](https://bgoonz-blog.netlify.app/showcase/)
* [/blog/blog-archive/](https://bgoonz-blog.netlify.app/blog/blog-archive/)
* [/blog/](https://bgoonz-blog.netlify.app/blog/)
* [/review/](https://bgoonz-blog.netlify.app/review/)
* [/blog/data-structures/](https://bgoonz-blog.netlify.app/blog/data-structures/)
* [/blog/blogwcomments/](https://bgoonz-blog.netlify.app/blog/blogwcomments/)
* [/blog/platform-docs/](https://bgoonz-blog.netlify.app/blog/platform-docs/)
* [/blog/python-resources/](https://bgoonz-blog.netlify.app/blog/python-resources/)
* [/blog/python-for-js-dev/](https://bgoonz-blog.netlify.app/blog/python-for-js-dev/)
* [/docs/gallery/](https://bgoonz-blog.netlify.app/docs/gallery/)
* [/blog/my-medium/](https://bgoonz-blog.netlify.app/blog/my-medium/)
* [/docs/search/](https://bgoonz-blog.netlify.app/docs/search/)
* [/docs/about/eng-portfolio/](https://bgoonz-blog.netlify.app/docs/about/eng-portfolio/)
* [/docs/about/intrests/](https://bgoonz-blog.netlify.app/docs/about/intrests/)
* [/docs/sitemap/](https://bgoonz-blog.netlify.app/docs/sitemap/)
* [/docs/about/resume/](https://bgoonz-blog.netlify.app/docs/about/resume/)
* [/blog/web-scraping/](https://bgoonz-blog.netlify.app/blog/web-scraping/)
* [/docs/about/job-search/](https://bgoonz-blog.netlify.app/docs/about/job-search/)
* [/docs/](https://bgoonz-blog.netlify.app/docs/)
* [/docs/articles/buffers/](https://bgoonz-blog.netlify.app/docs/articles/buffers/)
* [/docs/about/](https://bgoonz-blog.netlify.app/docs/about/)
* [/docs/articles/event-loop/](https://bgoonz-blog.netlify.app/docs/articles/event-loop/)
* [/docs/articles/dev-dep/](https://bgoonz-blog.netlify.app/docs/articles/dev-dep/)
* [/docs/articles/](https://bgoonz-blog.netlify.app/docs/articles/)
* [/docs/articles/install/](https://bgoonz-blog.netlify.app/docs/articles/install/)
* [/docs/articles/fs-module/](https://bgoonz-blog.netlify.app/docs/articles/fs-module/)
* [/docs/articles/node-cli-args/](https://bgoonz-blog.netlify.app/docs/articles/node-cli-args/)
* [/docs/articles/module-exports/](https://bgoonz-blog.netlify.app/docs/articles/module-exports/)
* [/docs/articles/node-env-variables/](https://bgoonz-blog.netlify.app/docs/articles/node-env-variables/)
* [/docs/articles/intro/](https://bgoonz-blog.netlify.app/docs/articles/intro/)
* [/docs/articles/node-js-language/](https://bgoonz-blog.netlify.app/docs/articles/node-js-language/)
* [/docs/articles/basic-web-dev/](https://bgoonz-blog.netlify.app/docs/articles/basic-web-dev/)
* [/docs/articles/node-repl/](https://bgoonz-blog.netlify.app/docs/articles/node-repl/)
* [/docs/articles/node-package-manager/](https://bgoonz-blog.netlify.app/docs/articles/node-package-manager/)
* [/docs/articles/node-run-cli/](https://bgoonz-blog.netlify.app/docs/articles/node-run-cli/)
* [/docs/articles/npx/](https://bgoonz-blog.netlify.app/docs/articles/npx/)
* [/docs/articles/v8/](https://bgoonz-blog.netlify.app/docs/articles/v8/)
* [/docs/articles/nodevsbrowser/](https://bgoonz-blog.netlify.app/docs/articles/nodevsbrowser/)
* [/docs/articles/reading-files/](https://bgoonz-blog.netlify.app/docs/articles/reading-files/)
* [/docs/articles/nodejs/](https://bgoonz-blog.netlify.app/docs/articles/nodejs/)
* [/docs/articles/npm/](https://bgoonz-blog.netlify.app/docs/articles/npm/)
* [/docs/articles/semantic/](https://bgoonz-blog.netlify.app/docs/articles/semantic/)
* [/docs/articles/writing-files/](https://bgoonz-blog.netlify.app/docs/articles/writing-files/)
* [/docs/audio/dynamic-time-warping/](https://bgoonz-blog.netlify.app/docs/audio/dynamic-time-warping/)
* [/docs/audio/](https://bgoonz-blog.netlify.app/docs/audio/)
* [/docs/audio/terms/](https://bgoonz-blog.netlify.app/docs/audio/terms/)
* [/docs/articles/os-module/](https://bgoonz-blog.netlify.app/docs/articles/os-module/)
* [/docs/community/](https://bgoonz-blog.netlify.app/docs/community/)
* [/docs/community/video-chat/](https://bgoonz-blog.netlify.app/docs/community/video-chat/)
* [/docs/content/archive/](https://bgoonz-blog.netlify.app/docs/content/archive/)
* [/docs/content/data-structures-algo/](https://bgoonz-blog.netlify.app/docs/content/data-structures-algo/)
* [/docs/content/](https://bgoonz-blog.netlify.app/docs/content/)
* [/docs/content/notes-template/](https://bgoonz-blog.netlify.app/docs/content/notes-template/)
* [/docs/content/gatsby-Queries-Mutations/](https://bgoonz-blog.netlify.app/docs/content/gatsby-Queries-Mutations/)
* [/docs/content/projects/](https://bgoonz-blog.netlify.app/docs/content/projects/)
* [/docs/content/trouble-shooting/](https://bgoonz-blog.netlify.app/docs/content/trouble-shooting/)
* [/docs/audio/dfft/](https://bgoonz-blog.netlify.app/docs/audio/dfft/)
* [/docs/content/algo/](https://bgoonz-blog.netlify.app/docs/content/algo/)
* [/docs/docs/await-keyword/](https://bgoonz-blog.netlify.app/docs/docs/await-keyword/)
* [/docs/docs/appendix/](https://bgoonz-blog.netlify.app/docs/docs/appendix/)
* [/docs/docs/algolia/](https://bgoonz-blog.netlify.app/docs/docs/algolia/)
* [/docs/docs/data-structures-docs/](https://bgoonz-blog.netlify.app/docs/docs/data-structures-docs/)
* [/docs/docs/](https://bgoonz-blog.netlify.app/docs/docs/)
* [/docs/docs/git-repos/](https://bgoonz-blog.netlify.app/docs/docs/git-repos/)
* [/docs/docs/sitemap/](https://bgoonz-blog.netlify.app/docs/docs/sitemap/)
* [/docs/docs/css/](https://bgoonz-blog.netlify.app/docs/docs/css/)
* [/docs/docs/regex-in-js/](https://bgoonz-blog.netlify.app/docs/docs/regex-in-js/)
* [/docs/faq/contact/](https://bgoonz-blog.netlify.app/docs/faq/contact/)
* [/docs/interact/jupyter-notebooks/](https://bgoonz-blog.netlify.app/docs/interact/jupyter-notebooks/)
* [/docs/interact/clock/](https://bgoonz-blog.netlify.app/docs/interact/clock/)
* [/docs/interact/](https://bgoonz-blog.netlify.app/docs/interact/)
* [/docs/faq/](https://bgoonz-blog.netlify.app/docs/faq/)
* [/docs/interact/video-chat/](https://bgoonz-blog.netlify.app/docs/interact/video-chat/)
* [/docs/interact/other-sites/](https://bgoonz-blog.netlify.app/docs/interact/other-sites/)
* [/docs/faq/plug-ins/](https://bgoonz-blog.netlify.app/docs/faq/plug-ins/)
* [/docs/medium/my-websites/](https://bgoonz-blog.netlify.app/docs/medium/my-websites/)
* [/docs/medium/medium-links/](https://bgoonz-blog.netlify.app/docs/medium/medium-links/)
* [/docs/medium/](https://bgoonz-blog.netlify.app/docs/medium/)
* [/docs/quick-reference/create-react-app/](https://bgoonz-blog.netlify.app/docs/quick-reference/create-react-app/)
* [/docs/javascript/constructor-functions/](https://bgoonz-blog.netlify.app/docs/javascript/constructor-functions/)
* [/docs/quick-reference/Emmet/](https://bgoonz-blog.netlify.app/docs/quick-reference/Emmet/)
* [/docs/python/](https://bgoonz-blog.netlify.app/docs/python/)
* [/docs/quick-reference/awesome-static/](https://bgoonz-blog.netlify.app/docs/quick-reference/awesome-static/)
* [/docs/quick-reference/](https://bgoonz-blog.netlify.app/docs/quick-reference/)
* [/docs/quick-reference/new-repo-instructions/](https://bgoonz-blog.netlify.app/docs/quick-reference/new-repo-instructions/)
* [/docs/quick-reference/installation/](https://bgoonz-blog.netlify.app/docs/quick-reference/installation/)
* [/docs/quick-reference/google-firebase/](https://bgoonz-blog.netlify.app/docs/quick-reference/google-firebase/)
* [/docs/quick-reference/notes-template/](https://bgoonz-blog.netlify.app/docs/quick-reference/notes-template/)
* [/docs/quick-reference/heroku-error-codes/](https://bgoonz-blog.netlify.app/docs/quick-reference/heroku-error-codes/)
* [/docs/quick-reference/psql-setup/](https://bgoonz-blog.netlify.app/docs/quick-reference/psql-setup/)
* [/docs/react/createReactApp/](https://bgoonz-blog.netlify.app/docs/react/createReactApp/)
* [/docs/quick-reference/topRepos/](https://bgoonz-blog.netlify.app/docs/quick-reference/topRepos/)
* [/docs/react/react2/](https://bgoonz-blog.netlify.app/docs/react/react2/)
* [/docs/quick-reference/resources/](https://bgoonz-blog.netlify.app/docs/quick-reference/resources/)
* [/docs/quick-reference/vscode/](https://bgoonz-blog.netlify.app/docs/quick-reference/vscode/)
* [/docs/tools/dev-utilities/](https://bgoonz-blog.netlify.app/docs/tools/dev-utilities/)
* [/docs/tools/data-structures/](https://bgoonz-blog.netlify.app/docs/tools/data-structures/)
* [/docs/tools/markdown-html/](https://bgoonz-blog.netlify.app/docs/tools/markdown-html/)
* [/docs/quick-reference/psql/](https://bgoonz-blog.netlify.app/docs/quick-reference/psql/)

***

#### Links

**Try it out without cloning the entire repo**

[**stackblitz demo hosted on firebase**](https://exploring-firebase-4c023.firebaseapp.com/)

* [/showcase/](https://bgoonz-blog.netlify.app/showcase/)
* [/repos/](https://bgoonz-blog.netlify.app/repos/)
* [/blog/](https://bgoonz-blog.netlify.app/blog/)
* [/docs/jupyter-notebooks/](https://bgoonz-blog.netlify.app/docs/jupyter-notebooks/)
* [/docs/portfolio-web/](https://bgoonz-blog.netlify.app/docs/portfolio-web/)
* [/docs/python/](https://bgoonz-blog.netlify.app/docs/python/)
* [/docs/About/](https://bgoonz-blog.netlify.app/docs/About/)
* [/docs/About/resume/](https://bgoonz-blog.netlify.app/docs/About/resume/)
* [/docs/about/](https://bgoonz-blog.netlify.app/docs/about/)
* [/docs/faq/](https://bgoonz-blog.netlify.app/docs/faq/)
* [/docs/quick-reference/](https://bgoonz-blog.netlify.app/docs/quick-reference/)
* [/docs/quick-reference/Emmet/](https://bgoonz-blog.netlify.app/docs/quick-reference/Emmet/)
* [/docs/quick-reference/new-repo-instructions/](https://bgoonz-blog.netlify.app/docs/quick-reference/new-repo-instructions/)
* [/docs/links/Social/](https://bgoonz-blog.netlify.app/docs/links/Social/)
* [/docs/links/](https://bgoonz-blog.netlify.app/docs/links/)
* [/docs/quick-reference/installation/](https://bgoonz-blog.netlify.app/docs/quick-reference/installation/)
* [/docs/links/my-websites/](https://bgoonz-blog.netlify.app/docs/links/my-websites/)
* [/docs/](https://bgoonz-blog.netlify.app/docs/)
* [/blog/community/](https://bgoonz-blog.netlify.app/blog/community/)
* [/blog/python/](https://bgoonz-blog.netlify.app/blog/python/)
* [/docs/resources/](https://bgoonz-blog.netlify.app/docs/resources/)
* [/docs/react/createReactApp/](https://bgoonz-blog.netlify.app/docs/react/createReactApp/)
* [/docs/tools/](https://bgoonz-blog.netlify.app/docs/tools/)
* [/notes-template/](https://bgoonz-blog.netlify.app/notes-template/)
* [/blog/my-medium/](https://bgoonz-blog.netlify.app/blog/my-medium/)
* [/docs/tools/default-readme/](https://bgoonz-blog.netlify.app/docs/tools/default-readme/)
* [/docs/tools/plug-ins/](https://bgoonz-blog.netlify.app/docs/tools/plug-ins/)
* [/docs/react/react2/](https://bgoonz-blog.netlify.app/docs/react/react2/)
* [/docs/tools/notes-template/](https://bgoonz-blog.netlify.app/docs/tools/notes-template/)
* [/review/](https://bgoonz-blog.netlify.app/review/)
* [/docs/articles/basic-web-dev/](https://bgoonz-blog.netlify.app/docs/articles/basic-web-dev/)
* [/blog/data-structures/](https://bgoonz-blog.netlify.app/blog/data-structures/)
* [/docs/About/me/](https://bgoonz-blog.netlify.app/docs/About/me/)
* [/docs/About/introduction2bg/](https://bgoonz-blog.netlify.app/docs/About/introduction2bg/)
* [/docs/react/](https://bgoonz-blog.netlify.app/docs/react/)
* [/docs/tools/Git-Html-Preview/](https://bgoonz-blog.netlify.app/docs/tools/Git-Html-Preview/)
* [/gallery/](https://bgoonz-blog.netlify.app/gallery/)

### Blog

* [introductory-react-part-2](https://bryanguner.medium.com/introductory-react-part-2-cda01615a186?source=your_stories_page-------------------------------------)
* [a-very-quick-guide-to-calculating-big-o-computational-complexity](https://bryanguner.medium.com/a-very-quick-guide-to-calculating-big-o-computational-complexity-eb1557e85fa3?source=your_stories_page-------------------------------------)
* [introduction-to-react-for-complete-beginners](https://javascript.plainenglish.io/introduction-to-react-for-complete-beginners-8021738aa1ad?source=your_stories_page-------------------------------------)
* [scheduling-settimeout-and-setinterval](https://javascript.plainenglish.io/scheduling-settimeout-and-setinterval-fcb2f40d16f7?source=your_stories_page-------------------------------------)
* [css-animations](https://bryanguner.medium.com/css-animations-d196a20099a5?source=your_stories_page-------------------------------------)
* [these-are-the-bash-shell-commands-that-stand-between-me-and-insanity](https://bryanguner.medium.com/these-are-the-bash-shell-commands-that-stand-between-me-and-insanity-984865ba5d1b?source=your_stories_page-------------------------------------)
* [how-to-implement-native-es6-data-structures-using-arrays-objects](https://bryanguner.medium.com/how-to-implement-native-es6-data-structures-using-arrays-objects-ce953b9f6a07?source=your_stories_page-------------------------------------)
* [objects-in-javascript](https://medium.com/codex/objects-in-javascript-cc578a781e1d?source=your_stories_page-------------------------------------)
* [absolute-beginners-guide-to-javascript-part1](https://javascript.plainenglish.io/absolute-beginners-guide-to-javascript-part-1-e222d166b6e1?source=your_stories_page-------------------------------------)
* [web-developer-resource-list-part-4](https://medium.com/star-gazers/web-developer-resource-list-part-4-fd686892b9eb?source=your_stories_page-------------------------------------)
* [vscode-extensions-specifically-for-javascript-development](https://medium.com/codex/vscode-extensions-specifically-for-javascript-development-ea91305cbd4a?source=your_stories_page-------------------------------------)
* [a-list-of-all-of-my-articles-to-link-to-future-posts](https://bryanguner.medium.com/a-list-of-all-of-my-articles-to-link-to-future-posts-1f6f88ebdf5b?source=your_stories_page-------------------------------------)
* [lists-stacks-and-queues-in-javascript](https://javascript.plainenglish.io/lists-stacks-and-queues-in-javascript-88466fae0fbb?source=your_stories_page-------------------------------------)
* [web-development-resources-part-3](https://bryanguner.medium.com/web-development-resources-part-3-f862ceb2b82a?source=your_stories_page-------------------------------------)
* [web-development-interview-part-3](https://medium.com/codex/web-development-interview-part-3-826ae81a9107?source=your_stories_page-------------------------------------)
* [running-list-of-interesting-articles-tools](https://bryanguner.medium.com/running-list-of-interesting-articles-tools-and-ideas-as-i-explore-them-b87a2f04d9a6?source=your_stories_page-------------------------------------)
* [the-best-cloud-based-code-playgrounds-of-2021-part-1](https://bryanguner.medium.com/the-best-cloud-based-code-playgrounds-of-2021-part-1-cdae9448db24?source=your_stories_page-------------------------------------)
* [front-end-interview-questions-part-2](https://medium.com/codex/front-end-interview-questions-part-2-86ddc0e91443?source=your_stories_page-------------------------------------)
* [web-developer-resource-list-part-2](https://medium.com/star-gazers/web-developer-resource-list-part-2-9c5cb56ab263?source=your_stories_page-------------------------------------)
* [http-basics](https://levelup.gitconnected.com/http-basics-8f02a96a834a?source=your_stories_page-------------------------------------)
* [javascript-frameworks-libraries](https://javascript.plainenglish.io/javascript-frameworks-libraries-35931e187a35?source=your_stories_page-------------------------------------)
* [my-take-on-awesome-javascript](https://javascript.plainenglish.io/my-take-on-awesome-javascript-243255451e74?source=your_stories_page-------------------------------------)
* [get-started-with-vscode-extensions](https://levelup.gitconnected.com/everything-you-need-to-get-started-with-vscode-extensions-resources-b9f4c8d91931?source=your_stories_page-------------------------------------)
* [my-favorite-vscode-themes](https://levelup.gitconnected.com/my-favorite-vscode-themes-9bab65af3f0f?source=your_stories_page-------------------------------------)
* [object-oriented-programming-in-javascript](https://levelup.gitconnected.com/object-oriented-programming-in-javascript-d45007d06333?source=your_stories_page-------------------------------------)
* [javascript-rotate-array-problemwalkthrough](https://medium.com/codex/javascript-rotate-array-problemwalkthrough-31deb19ebba1?source=your_stories_page-------------------------------------)
* [super-simple-intro-to-html-651d695f9bc](https://levelup.gitconnected.com/super-simple-intro-to-html-651d695f9bc?source=your_stories_page-------------------------------------)
* [everything-you-need-to-know-about-relational-databases-sql-postgresql](https://medium.com/codex/everything-you-need-to-know-about-relational-databases-sql-postgresql-and-sequelize-to-build-8acb68284a98?source=your_stories_page-------------------------------------)
* [understanding-git-a-beginners-guide-containing-cheat-sheets-resources-b50c9c01a107](https://levelup.gitconnected.com/understanding-git-a-beginners-guide-containing-cheat-sheets-resources-b50c9c01a107?source=your_stories_page-------------------------------------)
* [complete-javascript-reference-guide-64306cd6b0db](https://javascript.plainenglish.io/complete-javascript-reference-guide-64306cd6b0db?source=your_stories_page-------------------------------------)- \[

***

***

### 🚀 Quick start

1. **Create a Gatsby site.**

   Use the Gatsby CLI to create a new site, specifying the default starter.

   ```shell

   # create a new Gatsby site using the default starter

   gatsby new my-default-starter https://github.com/gatsbyjs/gatsby-starter-default
   ```
2. **Start developing.**

   Navigate into your new site's directory and start it up.

   ```shell

   cd my-default-starter/

   gatsby develop
   ```
3. **Open the source code and start editing!**

   Your site is now running at `http://localhost:8000`!

   *Note: You'll also see a second link:*`http://localhost:8000/___graphql`*. This is a tool you can use to experiment with querying your data. Learn more about using this tool in the* [*Gatsby tutorial*](https://www.gatsbyjs.com/tutorial/part-five/#introducing-graphiql)*.*

   Open the `my-default-starter` directory in your code editor of choice and edit `src/pages/index.js`. Save your changes and the browser will update in real time!

### 🧐 What's inside?

A quick look at the top-level files and directories you'll see in a Gatsby project.

```
.

├── node_modules

├── src

├── .gitignore

├── .prettierrc

├── gatsby-browser.js

├── gatsby-config.js

├── gatsby-node.js

├── gatsby-ssr.js

├── LICENSE

├── package-lock.json

├── package.json

└── README.md
```

1. **`/node_modules`**: This directory contains all of the modules of code that your project depends on (npm packages) are automatically installed.
2. **`/src`**: This directory will contain all of the code related to what you will see on the front-end of your site (what you see in the browser) such as your site header or a page template. `src` is a convention for "source code".
3. **`.gitignore`**: This file tells git which files it should not track / not maintain a version history for.
4. **`.prettierrc`**: This is a configuration file for [Prettier](https://prettier.io/). Prettier is a tool to help keep the formatting of your code consistent.
5. **`gatsby-browser.js`**: This file is where Gatsby expects to find any usage of the [Gatsby browser APIs](https://www.gatsbyjs.com/docs/browser-apis/) (if any). These allow customization/extension of default Gatsby settings affecting the browser.
6. **`gatsby-config.js`**: This is the main configuration file for a Gatsby site. This is where you can specify information about your site (metadata) like the site title and description, which Gatsby plugins you'd like to include, etc. (Check out the [config docs](https://www.gatsbyjs.com/docs/gatsby-config/) for more detail).
7. **`gatsby-node.js`**: This file is where Gatsby expects to find any usage of the [Gatsby Node APIs](https://www.gatsbyjs.com/docs/node-apis/) (if any). These allow customization/extension of default Gatsby settings affecting pieces of the site build process.
8. **`gatsby-ssr.js`**: This file is where Gatsby expects to find any usage of the [Gatsby server-side rendering APIs](https://www.gatsbyjs.com/docs/ssr-apis/) (if any). These allow customization of default Gatsby settings affecting server-side rendering.
9. **`LICENSE`**: This Gatsby starter is licensed under the 0BSD license. This means that you can see this file as a placeholder and replace it with your own license.
10. **`package-lock.json`** (See `package.json` below, first). This is an automatically generated file based on the exact versions of your npm dependencies that were installed for your project. **(You won't change this file directly).**
11. **`package.json`**: A manifest file for Node.js projects, which includes things like metadata (the project's name, author, etc). This manifest is how npm knows which packages to install for your project.
12. **`README.md`**: A text file containing useful reference information about your project.

### 🎓 Learning Gatsby

Looking for more guidance? Full documentation for Gatsby lives [on the website](https://www.gatsbyjs.com/). Here are some places to start:

* **For most developers, we recommend starting with our** [**in-depth tutorial for creating a site with Gatsby**](https://www.gatsbyjs.com/tutorial/)**.** It starts with zero assumptions about your level of ability and walks through every step of the process.
* **To dive straight into code samples, head** [**to our documentation**](https://www.gatsbyjs.com/docs/)**.** In particular, check out the *Guides*, *API Reference*, and *Advanced Tutorials* sections in the sidebar.

### 💫 Deploy

[![Deploy to Netlify](https://www.netlify.com/img/deploy/button.svg)](https://app.netlify.com/start/deploy?repository=https://github.com/BGOONZ_BLOG_2.0.git)

[![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/import/project?template=https://github.com/BGOONZ_BLOG_2.0.git)

***

***

## Codebase

```



bryan@LAPTOP-9LGJ3JGS:/c/MY-WEB-DEV/BLOG____2.0/BLOG_2.0/src$ tree -f

.

├── ./components

│   ├── ./components/ActionLink.js

│   ├── ./components/CtaButtons.js

│   ├── ./components/DocsMenu.js

│   ├── ./components/DocsSubmenu.js

│   ├── ./components/Footer.js

│   ├── ./components/Header.js

│   ├── ./components/Icon.js

│   ├── ./components/Layout.js

│   ├── ./components/SectionContent.js

│   ├── ./components/SectionCta.js

│   ├── ./components/SectionDocs.js

│   ├── ./components/SectionGrid.js

│   ├── ./components/SectionHero.js

│   ├── ./components/Submenu.js

│   ├── ./components/global.css

│   └── ./components/index.js

├── ./data

│   └── ./data/doc_sections.yml

├── ./hooks

│   └── ./hooks/useScript.js

├── ./html.js

├── ./pages

│   ├── ./pages/blog

│   │   ├── ./pages/blog/blog-archive.md

│   │   ├── ./pages/blog/blogwcomments.md

│   │   ├── ./pages/blog/data-structures.md

│   │   ├── ./pages/blog/index.md

│   │   ├── ./pages/blog/my-medium.md

│   │   ├── ./pages/blog/platform-docs.md

│   │   ├── ./pages/blog/python-for-js-dev.md

│   │   ├── ./pages/blog/python-resources.md

│   │   └── ./pages/blog/web-scraping.md

│   ├── ./pages/docs

│   │   ├── ./pages/docs/about

│   │   │   ├── ./pages/docs/about/index.md

│   │   │   ├── ./pages/docs/about/me.md

│   │   │   ├── ./pages/docs/about/node

│   │   │   │   ├── ./pages/docs/about/node/install.md

│   │   │   │   ├── ./pages/docs/about/node/intro.md

│   │   │   │   ├── ./pages/docs/about/node/nodejs.md

│   │   │   │   ├── ./pages/docs/about/node/nodevsbrowser.md

│   │   │   │   ├── ./pages/docs/about/node/reading-files.md

│   │   │   │   └── ./pages/docs/about/node/writing-files.md

│   │   │   ├── ./pages/docs/about/npm.md

│   │   │   └── ./pages/docs/about/resume.md

│   │   ├── ./pages/docs/articles

│   │   │   ├── ./pages/docs/articles/algo.md

│   │   │   ├── ./pages/docs/articles/article-compilation.md

│   │   │   ├── ./pages/docs/articles/basic-web-dev.md

│   │   │   ├── ./pages/docs/articles/gists.md

│   │   │   ├── ./pages/docs/articles/index.md

│   │   │   ├── ./pages/docs/articles/install.md

│   │   │   ├── ./pages/docs/articles/intro.md

│   │   │   ├── ./pages/docs/articles/python.md

│   │   │   ├── ./pages/docs/articles/reading-files.md

│   │   │   ├── ./pages/docs/articles/resources.md

│   │   │   ├── ./pages/docs/articles/ten-jamstack-apis-to-checkout.md

│   │   │   └── ./pages/docs/articles/writing-files.md

│   │   ├── ./pages/docs/docs

│   │   │   └── ./pages/docs/docs/tools

│   │   │       └── ./pages/docs/docs/tools/file-types.md

│   │   ├── ./pages/docs/faq

│   │   │   ├── ./pages/docs/faq/contact.md

│   │   │   └── ./pages/docs/faq/index.md

│   │   ├── ./pages/docs/gists.md

│   │   ├── ./pages/docs/index.md

│   │   ├── ./pages/docs/interact

│   │   │   ├── ./pages/docs/interact/clock.md

│   │   │   ├── ./pages/docs/interact/index.md

│   │   │   └── ./pages/docs/interact/jupyter-notebooks.md

│   │   ├── ./pages/docs/links

│   │   │   ├── ./pages/docs/links/index.md

│   │   │   ├── ./pages/docs/links/medium-links.md

│   │   │   ├── ./pages/docs/links/my-websites.md

│   │   │   └── ./pages/docs/links/social.md

│   │   ├── ./pages/docs/quick-reference

│   │   │   ├── ./pages/docs/quick-reference/Emmet.md

│   │   │   ├── ./pages/docs/quick-reference/docs.md

│   │   │   ├── ./pages/docs/quick-reference/index.md

│   │   │   ├── ./pages/docs/quick-reference/installation.md

│   │   │   └── ./pages/docs/quick-reference/new-repo-instructions.md

│   │   ├── ./pages/docs/react

│   │   │   ├── ./pages/docs/react/createReactApp.md

│   │   │   ├── ./pages/docs/react/index.md

│   │   │   └── ./pages/docs/react/react2.md

│   │   ├── ./pages/docs/react-in-depth.md

│   │   ├── ./pages/docs/sitemap.md

│   │   └── ./pages/docs/tools

│   │       ├── ./pages/docs/tools/index.md

│   │       ├── ./pages/docs/tools/notes-template.md

│   │       ├── ./pages/docs/tools/plug-ins.md

│   │       └── ./pages/docs/tools/vscode.md

│   ├── ./pages/index.md

│   ├── ./pages/notes-template.md

│   ├── ./pages/review.md

│   └── ./pages/showcase.md

├── ./sass

│   ├── ./sass/imports

│   │   ├── ./sass/imports/_animations.scss

│   │   ├── ./sass/imports/_buttons.scss

│   │   ├── ./sass/imports/_docs.scss

│   │   ├── ./sass/imports/_footer.scss

│   │   ├── ./sass/imports/_forms.scss

│   │   ├── ./sass/imports/_functions.scss

│   │   ├── ./sass/imports/_general.scss

│   │   ├── ./sass/imports/_header.scss

│   │   ├── ./sass/imports/_helpers.scss

│   │   ├── ./sass/imports/_icons.scss

│   │   ├── ./sass/imports/_palettes.scss

│   │   ├── ./sass/imports/_posts.scss

│   │   ├── ./sass/imports/_prism.scss

│   │   ├── ./sass/imports/_reset.scss

│   │   ├── ./sass/imports/_sections.scss

│   │   ├── ./sass/imports/_structure.scss

│   │   ├── ./sass/imports/_tables.scss

│   │   └── ./sass/imports/_variables.scss

│   └── ./sass/main.scss

├── ./templates

│   ├── ./templates/advanced.js

│   ├── ./templates/blog.js

│   ├── ./templates/docs.js

│   ├── ./templates/page.js

│   └── ./templates/post.js

└── ./utils

    ├── ./utils/attribute.js

    ├── ./utils/classNames.js

    ├── ./utils/cycler.js

    ├── ./utils/getData.js

    ├── ./utils/getPage.js

    ├── ./utils/getPageByFilePath.js

    ├── ./utils/getPages.js

    ├── ./utils/htmlToReact.js

    ├── ./utils/index.js

    ├── ./utils/link.js

    ├── ./utils/markdownify.js

    ├── ./utils/pathJoin.js

    ├── ./utils/toStyleObj.js

    ├── ./utils/toUrl.js

    └── ./utils/withPrefix.js



21 directories, 119 files

bryan@LAPTOP-9LGJ3JGS:/c/MY-WEB-DEV/BLOG____2.0/BLOG_2.0/src$






```

***

## Components

<details>

<summary></summary>

</details>


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://bryan-guner.gitbook.io/my-docs/untitled-1/content.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
