diff --git a/docs/create/aws/analytics-using-aws/index-analytics-using-aws.mdx b/docs/create/aws/analytics-using-aws/index-analytics-using-aws.mdx index e65cc898f1..d5f4d0c74d 100644 --- a/docs/create/aws/analytics-using-aws/index-analytics-using-aws.mdx +++ b/docs/create/aws/analytics-using-aws/index-analytics-using-aws.mdx @@ -1,7 +1,7 @@ --- id: index-analytics-using-aws -title: How to Build and Deploy Your Own Analytics Dashboard on AWS using NodeJS and Redis -sidebar_label: Building Analytics Dashboard using NodeJS and then deploy it on AWS +title: How to Build and Deploy Your Own Analytics Dashboard using NodeJS and Redis on the AWS Platform +sidebar_label: Building an Analytics Dashboard using NodeJS, Redis and AWS slug: /create/aws/analytics-using-aws authors: [ajeet] --- diff --git a/docs/create/aws/bidding-on-aws/index-bidding-on-aws.mdx b/docs/create/aws/bidding-on-aws/index-bidding-on-aws.mdx index 811b3369f1..36169c9ead 100644 --- a/docs/create/aws/bidding-on-aws/index-bidding-on-aws.mdx +++ b/docs/create/aws/bidding-on-aws/index-bidding-on-aws.mdx @@ -1,7 +1,7 @@ --- id: index-bidding-on-aws -title: How to Build a Real-Time Bidding Platform on AWS using NodeJS, AWS Lambda, and Redis -sidebar_label: Building a Real-Time Bidding Platform on AWS using NodeJS, AWS Lambda, and Redis +title: How to Build a Real-Time Bidding Platform using NodeJS, AWS Lambda and Redis +sidebar_label: Building a Real-Time Bidding Platform using NodeJS, AWS Lambda and Redis slug: /create/aws/bidding-on-aws authors: [ajeet] --- diff --git a/docs/create/aws/index-aws.mdx b/docs/create/aws/index-aws.mdx index a9e523e565..4998d89147 100644 --- a/docs/create/aws/index-aws.mdx +++ b/docs/create/aws/index-aws.mdx @@ -36,8 +36,8 @@ The following links provide you with the available options to run apps on Heroku
@@ -60,8 +60,8 @@ The following links provide you with the available options to run apps on Heroku
diff --git a/docs/create/netlify/deploy-docusaurus-to-netlify/images/netlify-auth.png b/docs/create/netlify/deploy-docusaurus-to-netlify/images/netlify-auth.png new file mode 100644 index 0000000000..36b06add56 Binary files /dev/null and b/docs/create/netlify/deploy-docusaurus-to-netlify/images/netlify-auth.png differ diff --git a/docs/create/netlify/deploy-docusaurus-to-netlify/images/netlify-auth2.png b/docs/create/netlify/deploy-docusaurus-to-netlify/images/netlify-auth2.png new file mode 100644 index 0000000000..c50139a9e9 Binary files /dev/null and b/docs/create/netlify/deploy-docusaurus-to-netlify/images/netlify-auth2.png differ diff --git a/docs/create/netlify/deploy-docusaurus-to-netlify/images/netlify-deploylog.png b/docs/create/netlify/deploy-docusaurus-to-netlify/images/netlify-deploylog.png new file mode 100644 index 0000000000..a672863105 Binary files /dev/null and b/docs/create/netlify/deploy-docusaurus-to-netlify/images/netlify-deploylog.png differ diff --git a/docs/create/netlify/deploy-docusaurus-to-netlify/images/netlify-importcode.png b/docs/create/netlify/deploy-docusaurus-to-netlify/images/netlify-importcode.png new file mode 100644 index 0000000000..ee65b7bd4d Binary files /dev/null and b/docs/create/netlify/deploy-docusaurus-to-netlify/images/netlify-importcode.png differ diff --git a/docs/create/netlify/deploy-docusaurus-to-netlify/images/netlify-importexisting.png b/docs/create/netlify/deploy-docusaurus-to-netlify/images/netlify-importexisting.png new file mode 100644 index 0000000000..f67320ed1b Binary files /dev/null and b/docs/create/netlify/deploy-docusaurus-to-netlify/images/netlify-importexisting.png differ diff --git a/docs/create/netlify/deploy-docusaurus-to-netlify/images/netlify-signin.png b/docs/create/netlify/deploy-docusaurus-to-netlify/images/netlify-signin.png new file mode 100644 index 0000000000..5c1217d634 Binary files /dev/null and b/docs/create/netlify/deploy-docusaurus-to-netlify/images/netlify-signin.png differ diff --git a/docs/create/netlify/deploy-docusaurus-to-netlify/images/netlify-success.png b/docs/create/netlify/deploy-docusaurus-to-netlify/images/netlify-success.png new file mode 100644 index 0000000000..aefd150c80 Binary files /dev/null and b/docs/create/netlify/deploy-docusaurus-to-netlify/images/netlify-success.png differ diff --git a/docs/create/netlify/deploy-docusaurus-to-netlify/images/netlify.png b/docs/create/netlify/deploy-docusaurus-to-netlify/images/netlify.png new file mode 100644 index 0000000000..72ba227ce5 Binary files /dev/null and b/docs/create/netlify/deploy-docusaurus-to-netlify/images/netlify.png differ diff --git a/docs/create/netlify/deploy-docusaurus-to-netlify/images/netlify_buildenviron.png b/docs/create/netlify/deploy-docusaurus-to-netlify/images/netlify_buildenviron.png new file mode 100644 index 0000000000..bf8e55423c Binary files /dev/null and b/docs/create/netlify/deploy-docusaurus-to-netlify/images/netlify_buildenviron.png differ diff --git a/docs/create/netlify/deploy-docusaurus-to-netlify/images/netlify_cd.png b/docs/create/netlify/deploy-docusaurus-to-netlify/images/netlify_cd.png new file mode 100644 index 0000000000..81c9541fea Binary files /dev/null and b/docs/create/netlify/deploy-docusaurus-to-netlify/images/netlify_cd.png differ diff --git a/docs/create/netlify/deploy-docusaurus-to-netlify/images/netlify_clickpreview.png b/docs/create/netlify/deploy-docusaurus-to-netlify/images/netlify_clickpreview.png new file mode 100644 index 0000000000..c0d53f0c3d Binary files /dev/null and b/docs/create/netlify/deploy-docusaurus-to-netlify/images/netlify_clickpreview.png differ diff --git a/docs/create/netlify/deploy-docusaurus-to-netlify/images/netlify_connectgit.png b/docs/create/netlify/deploy-docusaurus-to-netlify/images/netlify_connectgit.png new file mode 100644 index 0000000000..4533dca51d Binary files /dev/null and b/docs/create/netlify/deploy-docusaurus-to-netlify/images/netlify_connectgit.png differ diff --git a/docs/create/netlify/deploy-docusaurus-to-netlify/images/netlify_dash.png b/docs/create/netlify/deploy-docusaurus-to-netlify/images/netlify_dash.png new file mode 100644 index 0000000000..2cffed31be Binary files /dev/null and b/docs/create/netlify/deploy-docusaurus-to-netlify/images/netlify_dash.png differ diff --git a/docs/create/netlify/deploy-docusaurus-to-netlify/images/netlify_dashboard.png b/docs/create/netlify/deploy-docusaurus-to-netlify/images/netlify_dashboard.png new file mode 100644 index 0000000000..bf096a5390 Binary files /dev/null and b/docs/create/netlify/deploy-docusaurus-to-netlify/images/netlify_dashboard.png differ diff --git a/docs/create/netlify/deploy-docusaurus-to-netlify/images/netlify_devhub.png b/docs/create/netlify/deploy-docusaurus-to-netlify/images/netlify_devhub.png new file mode 100644 index 0000000000..536dc932d4 Binary files /dev/null and b/docs/create/netlify/deploy-docusaurus-to-netlify/images/netlify_devhub.png differ diff --git a/docs/create/netlify/deploy-docusaurus-to-netlify/images/netlify_git.png b/docs/create/netlify/deploy-docusaurus-to-netlify/images/netlify_git.png new file mode 100644 index 0000000000..43dcc3ed75 Binary files /dev/null and b/docs/create/netlify/deploy-docusaurus-to-netlify/images/netlify_git.png differ diff --git a/docs/create/netlify/deploy-docusaurus-to-netlify/images/netlify_import-to-github.png b/docs/create/netlify/deploy-docusaurus-to-netlify/images/netlify_import-to-github.png new file mode 100644 index 0000000000..f6746bc61a Binary files /dev/null and b/docs/create/netlify/deploy-docusaurus-to-netlify/images/netlify_import-to-github.png differ diff --git a/docs/create/netlify/deploy-docusaurus-to-netlify/images/netlify_sitedeploy-inprogress.png b/docs/create/netlify/deploy-docusaurus-to-netlify/images/netlify_sitedeploy-inprogress.png new file mode 100644 index 0000000000..400831cda0 Binary files /dev/null and b/docs/create/netlify/deploy-docusaurus-to-netlify/images/netlify_sitedeploy-inprogress.png differ diff --git a/docs/create/netlify/deploy-docusaurus-to-netlify/images/netlify_trigger.png b/docs/create/netlify/deploy-docusaurus-to-netlify/images/netlify_trigger.png new file mode 100644 index 0000000000..9c869292d7 Binary files /dev/null and b/docs/create/netlify/deploy-docusaurus-to-netlify/images/netlify_trigger.png differ diff --git a/docs/create/netlify/deploy-docusaurus-to-netlify/images/netlifyflow.png b/docs/create/netlify/deploy-docusaurus-to-netlify/images/netlifyflow.png new file mode 100644 index 0000000000..93e0b33a73 Binary files /dev/null and b/docs/create/netlify/deploy-docusaurus-to-netlify/images/netlifyflow.png differ diff --git a/docs/create/netlify/deploy-docusaurus-to-netlify/images/netlifyimage.png b/docs/create/netlify/deploy-docusaurus-to-netlify/images/netlifyimage.png new file mode 100644 index 0000000000..a1e3a82d3b Binary files /dev/null and b/docs/create/netlify/deploy-docusaurus-to-netlify/images/netlifyimage.png differ diff --git a/docs/create/netlify/deploy-docusaurus-to-netlify/images/netlifyinit.png b/docs/create/netlify/deploy-docusaurus-to-netlify/images/netlifyinit.png new file mode 100644 index 0000000000..9a9cb15c5c Binary files /dev/null and b/docs/create/netlify/deploy-docusaurus-to-netlify/images/netlifyinit.png differ diff --git a/docs/create/netlify/deploy-docusaurus-to-netlify/images/netlifyworkflow.png b/docs/create/netlify/deploy-docusaurus-to-netlify/images/netlifyworkflow.png new file mode 100644 index 0000000000..78ec0a26c8 Binary files /dev/null and b/docs/create/netlify/deploy-docusaurus-to-netlify/images/netlifyworkflow.png differ diff --git a/docs/create/netlify/deploy-docusaurus-to-netlify/images/preview.png b/docs/create/netlify/deploy-docusaurus-to-netlify/images/preview.png new file mode 100644 index 0000000000..b5d585f7b2 Binary files /dev/null and b/docs/create/netlify/deploy-docusaurus-to-netlify/images/preview.png differ diff --git a/docs/create/netlify/deploy-docusaurus-to-netlify/index-deploy-docusaurus-to-netlify.mdx b/docs/create/netlify/deploy-docusaurus-to-netlify/index-deploy-docusaurus-to-netlify.mdx new file mode 100644 index 0000000000..17922642c4 --- /dev/null +++ b/docs/create/netlify/deploy-docusaurus-to-netlify/index-deploy-docusaurus-to-netlify.mdx @@ -0,0 +1,128 @@ +--- +id: index-deploy-docusaurus-to-netlify +title: How to Deploy Docusaurus to Netlify in 5 Minutes +sidebar_label: Deploy Docusaurus to Netlify in 5 Minutes +slug: /create/netlify/deploy-docusaurus-to-netlify +--- + +import RedisCard from '@site/src/theme/RedisCard'; + + +Millions of developers use Netlify to instantly build, deploy and scale their modern web applications. The platform comes with the first class-support for every popular framework like JAMstack, React, VueJS, NextJS, Gatsby, AngularJS, Nuxt, Eleventy, Svelte, Hugo, Astro and so on. + + +![MyImage](images/preview.png) + + +The Netlify platform allows developers to build and deploy their site to the global network (CDN) from Git. It delivers out-of-the-box continous integration and continuous deployment. Developers love Netlify because it allows them to focus on building and deploying apps by abstracting all the maintenance work away from them. Features like free SSL, Custom Domain, deploy previews, functions and workflows etc makes Netlify the most comprehensive platform for web projects. + +
+
+ +
+
+ + +[In the last tutorial](/create/netlify/getting-started-with-netlify), we leveraged [Netlify CLI](https://docs.netlify.com/cli/get-started/) to build a simple Next.js application built using TailwindCSS and Redis. +In this tutorial, you will see how to deploy a Docusaurus site to Netlify Dashboard UI in 5 minutes. + +Let's get started.. + +### Table of Contents + +- Step 1. Sign-in for a new Netlify Account +- Step 2. Connect Netlify to a Git Provider +- Step 3. Import the GitHub repository to your GitHub account +- Step 4. Provide Netlify access to your GitHub repository +- Step 5. Configure site settings for Netlify +- Step 6. Deploy your site +- Step 7. Visit your new Docusaurus site on Netlify + + +### Step 1. Sign-in for a new Netlify Account + +Visit [https://app.netlify.com/](https://app.netlify.com/) and sign up for a Netlify account. + +![MyImage](images/netlify-signin.png) + +### Step 2. Connect your Netlify account to your Git Provider + +Netlify allows you to sign-in using various services, including GitHub, GitLab, Bitbucket, Email and SSO. +For this demo we'll use GitHub. Sign into GitHub to connect it to Netlify. + +It will ask you for two-factor authentication. + +![MyImage](images/netlify_git.png) + + +### Step 3. Import the project files to your GitHub account + +Once you connect your Netlify account to GitHub, you can start collaborating with your other team members. +Before we do that, let's push a sample Docusaurus site to our GitHub repository. You can use a generic Docusaurus site if you want. The Redis Developer Hub is built on Docusaurus, so we are using it instead. + +![MyImage](images/netlify-importexisting.png) + +### Step 4. Allow Netlify to access the GitHub repository + +Next, Netlify will allow you to import an existing project from a GitHub repository as shown below: + +![MyImage](images/netlify-importcode.png) + + +### Step 5. Configure site settings for Netlify + +There are two essential settings that need to be configured. +First, change the URL under `docusaurus.config.js` to any other random URL as shown below: + +```javascript title="docusaurus.config.js" +.... +module.exports = { + title: 'Redis Developer Hub', + tagline: 'The Home of Redis Developers', + url: 'https://docusaurus-2.netlify.app', + baseUrl: '/', + onBrokenLinks: 'throw', +... +... +``` + +Secondly, you will need to add a build command as shown below: +![MyImage](images/netlify_buildenviron.png) + + +### Step 6. Deploy your site + +Click "Deploys" on the top navigation, you will see an option "Trigger Deploy" on the right-side. +Choose "Deploy site". If you are performing it for the second time, then choose "Clear cache and deploy site" option. + +![MyImage](images/netlify_sitedeploy-inprogress.png) + + +Monitor the "Deploy Log" carefully to see if any error messages appear in the log. + +![MyImage](images/netlify-deploylog.png) + +You should now be able to see your Docusaurus site hosted on port 3000. +![MyImage](images/netlify-success.png) + +### Step 7. Visit your new Docusaurus site on Netlify + +Go to "Sites" on the top navigation menu and click on the latest preview build. + +![MyImage](images/netlify_clickpreview.png) + +You will able to see that Netlify uploads site assets to a content delivery network and makes your site available. +![MyImage](images/netlify_devhub.png) + + +### References + +- [Netlify Build - A Modern CI-CD Infrastructure for Frontend Teams](https://www.netlify.com/products/build/) +- [Netlify Functions](https://www.netlify.com/products/functions/) +- [Netlify Edge](https://www.netlify.com/products/edge/) +- [Netlify WorkFlow](https://www.netlify.com/products/workflow/) +- [Netlify Analytics](https://www.netlify.com/products/analytics/) diff --git a/docs/create/netlify/getting-started-with-netlify/access.png b/docs/create/netlify/getting-started-with-netlify/access.png new file mode 100644 index 0000000000..bf40ced4f1 Binary files /dev/null and b/docs/create/netlify/getting-started-with-netlify/access.png differ diff --git a/docs/create/netlify/getting-started-with-netlify/cachingapp.png b/docs/create/netlify/getting-started-with-netlify/cachingapp.png new file mode 100644 index 0000000000..ba1f9444c9 Binary files /dev/null and b/docs/create/netlify/getting-started-with-netlify/cachingapp.png differ diff --git a/docs/create/netlify/getting-started-with-netlify/clicktoaccess.png b/docs/create/netlify/getting-started-with-netlify/clicktoaccess.png new file mode 100644 index 0000000000..bdc2886078 Binary files /dev/null and b/docs/create/netlify/getting-started-with-netlify/clicktoaccess.png differ diff --git a/docs/create/netlify/getting-started-with-netlify/demoapp.png b/docs/create/netlify/getting-started-with-netlify/demoapp.png new file mode 100644 index 0000000000..f67e142024 Binary files /dev/null and b/docs/create/netlify/getting-started-with-netlify/demoapp.png differ diff --git a/docs/create/netlify/getting-started-with-netlify/environ_2.png b/docs/create/netlify/getting-started-with-netlify/environ_2.png new file mode 100644 index 0000000000..c024372b4e Binary files /dev/null and b/docs/create/netlify/getting-started-with-netlify/environ_2.png differ diff --git a/docs/create/netlify/getting-started-with-netlify/finalimage.png b/docs/create/netlify/getting-started-with-netlify/finalimage.png new file mode 100644 index 0000000000..0d9fce95b0 Binary files /dev/null and b/docs/create/netlify/getting-started-with-netlify/finalimage.png differ diff --git a/docs/create/netlify/getting-started-with-netlify/helloreact.png b/docs/create/netlify/getting-started-with-netlify/helloreact.png new file mode 100644 index 0000000000..3952158d76 Binary files /dev/null and b/docs/create/netlify/getting-started-with-netlify/helloreact.png differ diff --git a/docs/create/netlify/getting-started-with-netlify/index-getting-started-with-netlify.mdx b/docs/create/netlify/getting-started-with-netlify/index-getting-started-with-netlify.mdx new file mode 100644 index 0000000000..08bf747111 --- /dev/null +++ b/docs/create/netlify/getting-started-with-netlify/index-getting-started-with-netlify.mdx @@ -0,0 +1,214 @@ +--- +id: index-getting-started-with-netlify +title: Getting Started with Netlify +sidebar_label: Getting Started with Netlify +slug: /create/netlify/getting-started-with-netlify +--- + +import RedisCard from '@site/src/theme/RedisCard'; + +Netlify is a popular static site hosting serverless platform. It is a popular way to build, deploy, and scale modern web applications in a much more scalable and secure way. + +Netlify helps developers to launch websites and campaigns in minutes with no fuss. Netlify is built primarily for JAMstack sites, which unify JavaScript and APIs to allow applications that are well suited for both developers and content editors. + +![Register](recloud_1.png) + +### Features of Netlify + +- It delivers out-of-the-box continuous integration. +- The platform allows continuous deployment through its support for Git repository deployment. +- It allows developers to focus on building and deploying apps by abstracting all the maintenance work away from the developers. +- The platform provides free SSL, CDN, and continuous integration. +- It has built-in DNS management & SSL certificates. + +### How Netlify works? + +![MyImages](netlifyimage.png) + +1. The developer writes code and stores it in a version control repository (e.g. GitHub). +2. When a new change is merged into the main branch of the repository, a webhook notifies Netlify to deploy a new site. +3. Netlify pulls the latest version of the app from the repository and runs a build command to generate the static site files +4. Netlify then uses Plugins and internal code to make adjustments to your site, pre-render all of your pages in static HTML and improves it further +/ +5. Once the build process gets completed, Netlify takes the static assets and pushes them to its global CDN for fast delivery. + +In this tutorial, you will see how to deploy a simple Redis caching app built with Next.js and TailwindCSS to Netlify in 5 minutes. + + +### Table of Contents + +- Step 1. Setup a Free Redis Enterprise Cloud Account +- Step 2. Install Netlify CLI +- Step 3. Clone the GitHub repository +- Step 4. Login to Netlify via CLI +- Step 5. Configure Continuous Deployment +- Step 6. Pushing the changes to GitHub +- Step 7. Open the Netlify Admin URL +- Step 8. Add Environment Variable +- Step 9. Trigger the deployment +- Step 10. Accessing the app + +### Step 1. Setup a free Redis Enterprise Cloud account + +Visit [https://developer.redis.com/create/rediscloud/](https://developer.redis.com/create/rediscloud/) and create a free Redis Enterprise Cloud account. Enable the “RediSearch” module while you create the Redis Enterprise Cloud database. Once you complete the tutorial, you will be provided with the database Endpoint URL and password. Save it for future reference. + + +![MyImage](recloud_1.png) + + +### Step 2. Install Netlify CLI# + +Netlify’s command line interface (CLI) lets you configure continuous deployment directly from the command line. Run the below command to install Netlify CLI on your local laptop: + + +```bash + +npm install netlify-cli -g +``` + +Verify if Netlify is installed or not by running the below command: + +```bash + netlify version + netlify-cli/8.15.3 darwin-x64 node-v14.17.3 +``` + +### Step 3. Clone the repository + +```bash + git clone https://github.com/redis-developer/nextjs-redis-netlify +``` + + +### Step 4. Login to Netlify via CLI + +To authenticate and obtain an access token using the command line, run the following command to login to your Netlify account: + + + + ```bash + netlify login + ``` +This will open a browser window, asking you to log in with Netlify and grant access to Netlify CLI. +Once you authenticate, it will ask you to close the window and display the below results: + +
Result + +``` + Already logged in via netlify config on your machine + + Run netlify status for account details + + To see all available commands run: netlify help +``` +
+ + + +### Step 5. Configure continuous deployent + +The ```netlify init``` command allows you to configure continuous deployment for a new or existing site. +It will also allow you to create netlify.toml file if it doesn't exists. + +``` +netlify init +``` + + + +
Result + +``` +netlify init +? What would you like to do? + Create & configure a new site +? Team: Redis +Choose a unique site name (e.g. super-cool-site-by-redisdeveloper.netlify.app) or leave it blank for a random name. You can update the site name later. +? Site name (optional): undefined + +Site Created + +Admin URL: https://app.netlify.com/sites/super-cool-site-by-redisdeveloper +URL: https://super-cool-site-by-redisdeveloper.netlify.app +Site ID: a70bcfb7-b7b1-4fdd-be8b-5eb3b5dbd404 + +Linked to super-cool-site-by-redis-developer in /Users/redisdeveloper/projects/netlify/basic-caching-demo-nodejs/.netlify/state.json +? Your build command (hugo build/yarn run build/etc): yarn start +? Directory to deploy (blank for current dir): dist +? Netlify functions folder: functions +Adding deploy key to repository... +Deploy key added! + +Creating Netlify GitHub Notification Hooks... +Netlify Notification Hooks configured! + +Success! Netlify CI/CD Configured! + +This site is now configured to automatically deploy from github branches & pull requests + +Next steps: + + git push Push to your git repository to trigger new site builds + netlify open Open the Netlify admin URL of your site +``` +
+ +The above step creates a ```netlify.toml``` file with the following content + +```javacript title="netlify.toml" + [build] + command = "npm run build" + publish = ".next" + +[[plugins]] + package = "@netlify/plugin-nextjs" + +``` + + +### Step 6. Pushing the changes to GitHub + +As instructed by Netlify, run the below commands to push the latest changes to GitHub: + +``` +git add . +git commit -m “Pushing the latest changes” +git push +``` + +### Step 7. Open the Netlify Admin URL + +```bash + netlify open --admin +``` + +### Step 8. Add Environment Variable for Redis Enterprise Cloud + +![Environment Variable](environ_2.png) + + + +### Step 9. Trigger the deployment + +Click "Trigger deploy" to deploy the site + +![MyImage1](redisdeveloper_3.png) + + +## Step 10. Accessing the app + +Click on the deploy URL and you should be able to access the app as shown: + + +![MyImage](runningapp.png) + +### Try it Yourself + +[![Deploy to Netlify](https://www.netlify.com/img/deploy/button.svg)](https://app.netlify.com/start/deploy?repository=https://github.com/redis-developer/nextjs-redis-netlify) + +### References + +- [Redis Caching app using Next.js, TailwindCSS and Redis](https://github.com/redis-developer/nextjs-redis-netlify) +- [Introduction to Netlify](https://www.netlify.com/) +- [Netlify Functions](https://www.netlify.com/products/functions/) +- [Overview of JAMstack](https://www.netlify.com/jamstack/) + diff --git a/docs/create/netlify/getting-started-with-netlify/localsite.png b/docs/create/netlify/getting-started-with-netlify/localsite.png new file mode 100644 index 0000000000..e76ab0212c Binary files /dev/null and b/docs/create/netlify/getting-started-with-netlify/localsite.png differ diff --git a/docs/create/netlify/getting-started-with-netlify/login.png b/docs/create/netlify/getting-started-with-netlify/login.png new file mode 100644 index 0000000000..8d5af1dbff Binary files /dev/null and b/docs/create/netlify/getting-started-with-netlify/login.png differ diff --git a/docs/create/netlify/getting-started-with-netlify/netlify-logo.jpeg b/docs/create/netlify/getting-started-with-netlify/netlify-logo.jpeg new file mode 100644 index 0000000000..0a937d5253 Binary files /dev/null and b/docs/create/netlify/getting-started-with-netlify/netlify-logo.jpeg differ diff --git a/docs/create/netlify/getting-started-with-netlify/netlify.png b/docs/create/netlify/getting-started-with-netlify/netlify.png new file mode 100644 index 0000000000..72ba227ce5 Binary files /dev/null and b/docs/create/netlify/getting-started-with-netlify/netlify.png differ diff --git a/docs/create/netlify/getting-started-with-netlify/netlify_dash.png b/docs/create/netlify/getting-started-with-netlify/netlify_dash.png new file mode 100644 index 0000000000..2cffed31be Binary files /dev/null and b/docs/create/netlify/getting-started-with-netlify/netlify_dash.png differ diff --git a/docs/create/netlify/getting-started-with-netlify/netlify_dashboard.png b/docs/create/netlify/getting-started-with-netlify/netlify_dashboard.png new file mode 100644 index 0000000000..bf096a5390 Binary files /dev/null and b/docs/create/netlify/getting-started-with-netlify/netlify_dashboard.png differ diff --git a/docs/create/netlify/getting-started-with-netlify/netlifyflow.png b/docs/create/netlify/getting-started-with-netlify/netlifyflow.png new file mode 100644 index 0000000000..93e0b33a73 Binary files /dev/null and b/docs/create/netlify/getting-started-with-netlify/netlifyflow.png differ diff --git a/docs/create/netlify/getting-started-with-netlify/netlifyimage.png b/docs/create/netlify/getting-started-with-netlify/netlifyimage.png new file mode 100644 index 0000000000..a1e3a82d3b Binary files /dev/null and b/docs/create/netlify/getting-started-with-netlify/netlifyimage.png differ diff --git a/docs/create/netlify/getting-started-with-netlify/netlifyinit.png b/docs/create/netlify/getting-started-with-netlify/netlifyinit.png new file mode 100644 index 0000000000..9a9cb15c5c Binary files /dev/null and b/docs/create/netlify/getting-started-with-netlify/netlifyinit.png differ diff --git a/docs/create/netlify/getting-started-with-netlify/netlifylogo.gif b/docs/create/netlify/getting-started-with-netlify/netlifylogo.gif new file mode 100644 index 0000000000..6fe723cc1b Binary files /dev/null and b/docs/create/netlify/getting-started-with-netlify/netlifylogo.gif differ diff --git a/docs/create/netlify/getting-started-with-netlify/netlifyworkflow.png b/docs/create/netlify/getting-started-with-netlify/netlifyworkflow.png new file mode 100644 index 0000000000..78ec0a26c8 Binary files /dev/null and b/docs/create/netlify/getting-started-with-netlify/netlifyworkflow.png differ diff --git a/docs/create/netlify/getting-started-with-netlify/recloud_1.png b/docs/create/netlify/getting-started-with-netlify/recloud_1.png new file mode 100644 index 0000000000..f37fd1352b Binary files /dev/null and b/docs/create/netlify/getting-started-with-netlify/recloud_1.png differ diff --git a/docs/create/netlify/getting-started-with-netlify/rediscloud.png b/docs/create/netlify/getting-started-with-netlify/rediscloud.png new file mode 100644 index 0000000000..766590adcd Binary files /dev/null and b/docs/create/netlify/getting-started-with-netlify/rediscloud.png differ diff --git a/docs/create/netlify/getting-started-with-netlify/redisdeveloper_3.png b/docs/create/netlify/getting-started-with-netlify/redisdeveloper_3.png new file mode 100644 index 0000000000..8259e57f31 Binary files /dev/null and b/docs/create/netlify/getting-started-with-netlify/redisdeveloper_3.png differ diff --git a/docs/create/netlify/getting-started-with-netlify/runningapp.png b/docs/create/netlify/getting-started-with-netlify/runningapp.png new file mode 100644 index 0000000000..1a90e78ffb Binary files /dev/null and b/docs/create/netlify/getting-started-with-netlify/runningapp.png differ diff --git a/docs/create/netlify/getting-started-with-netlify/sitename.png b/docs/create/netlify/getting-started-with-netlify/sitename.png new file mode 100644 index 0000000000..915a60cbd5 Binary files /dev/null and b/docs/create/netlify/getting-started-with-netlify/sitename.png differ diff --git a/docs/create/netlify/getting-started-with-netlify/siteview.png b/docs/create/netlify/getting-started-with-netlify/siteview.png new file mode 100644 index 0000000000..9826b33792 Binary files /dev/null and b/docs/create/netlify/getting-started-with-netlify/siteview.png differ diff --git a/docs/create/netlify/getting-started-with-netlify/success.png b/docs/create/netlify/getting-started-with-netlify/success.png new file mode 100644 index 0000000000..c8d9e7a75d Binary files /dev/null and b/docs/create/netlify/getting-started-with-netlify/success.png differ diff --git a/docs/create/netlify/getting-started-with-netlify/viewsite.png b/docs/create/netlify/getting-started-with-netlify/viewsite.png new file mode 100644 index 0000000000..318bf24161 Binary files /dev/null and b/docs/create/netlify/getting-started-with-netlify/viewsite.png differ diff --git a/docs/develop/guides/netlify/getting-started/index-getting-started.mdx b/docs/develop/guides/netlify/getting-started/index-getting-started.mdx new file mode 100644 index 0000000000..233d93c639 --- /dev/null +++ b/docs/develop/guides/netlify/getting-started/index-getting-started.mdx @@ -0,0 +1,32 @@ +--- +id: index-getting-started +title: Getting Started with Netlify +sidebar_label: Getting Started with Netlify +slug: /develop/guides/netlify/getting-started +--- + +import Tabs from '@theme/Tabs'; +import TabItem from '@theme/TabItem'; +import useBaseUrl from '@docusaurus/useBaseUrl'; +import RedisCard from '@site/src/theme/RedisCard'; + + + + + + + + + + +### Step 1. Preparing the local environment + + + + + diff --git a/package-lock.json b/package-lock.json.backup similarity index 100% rename from package-lock.json rename to package-lock.json.backup diff --git a/sidebars.js b/sidebars.js index f0db7fb421..3def1128ad 100644 --- a/sidebars.js +++ b/sidebars.js @@ -64,8 +64,16 @@ module.exports = { 'create/windows/index-windows', 'create/from-source/index-from-source', 'create/jenkins/index-jenkins', - 'create/openshift/index-openshift' - ] + 'create/openshift/index-openshift', + { + type: 'category', + label: 'Redis using Netlify', + items: [ + 'create/netlify/getting-started-with-netlify/index-getting-started-with-netlify', + 'create/netlify/deploy-docusaurus-to-netlify/index-deploy-docusaurus-to-netlify', + ] + }, + ] }, { type: 'category', @@ -282,7 +290,7 @@ module.exports = { 'explore/redisinsight/usinghelm/index-usinghelm', ] }, - 'explore/redisdatasource/index-redisdatasource', + 'explore/redisdatasource/index-redisdatasource', 'explore/redisexplorer/index-redisexplorer', 'explore/datadog/index-datadog', 'explore/redismod/index-redismod', diff --git a/src/theme/DocItem/index.tsx b/src/theme/DocItem/index.tsx deleted file mode 100644 index bfbc8888d5..0000000000 --- a/src/theme/DocItem/index.tsx +++ /dev/null @@ -1,191 +0,0 @@ -/** - * Copyright (c) Facebook, Inc. and its affiliates. - * - * This source code is licensed under the MIT license found in the - * LICENSE file in the root directory of this source tree. - */ - -import React from 'react'; - -import Head from '@docusaurus/Head'; -import {useTitleFormatter} from '@docusaurus/theme-common'; -import useDocusaurusContext from '@docusaurus/useDocusaurusContext'; -import useBaseUrl from '@docusaurus/useBaseUrl'; -import DocPaginator from '@theme/DocPaginator'; -import DocVersionSuggestions from '@theme/DocVersionSuggestions'; -import type {Props} from '@theme/DocItem'; -import TOC from '@theme/TOC'; -import IconEdit from '@theme/IconEdit'; - -import clsx from 'clsx'; -import styles from './styles.module.css'; -import { - useActivePlugin, - useVersions, - useActiveVersion, -} from '@theme/hooks/useDocs'; - -function DocItem(props: Props): JSX.Element { - const {siteConfig} = useDocusaurusContext(); - const {url: siteUrl} = siteConfig; - const {content: DocContent} = props; - const { - metadata, - frontMatter: { - image: metaImage, - keywords, - hide_title: hideTitle, - hide_table_of_contents: hideTableOfContents, - authors, - }, - } = DocContent; - const { - description, - title, - permalink, - editUrl, - lastUpdatedAt, - lastUpdatedBy, - } = metadata; - - const authorLookup = siteConfig.customFields.authors; - - const {pluginId} = useActivePlugin({failfast: true}); - const versions = useVersions(pluginId); - const version = useActiveVersion(pluginId); - - // If site is not versioned or only one version is included - // we don't show the version badge - // See https://github.com/facebook/docusaurus/issues/3362 - const showVersionBadge = versions.length > 1; - - const metaTitle = useTitleFormatter(title); - const metaImageUrl = useBaseUrl(metaImage, {absolute: true}); - return ( - <> - - {metaTitle} - - {description && } - {description && ( - - )} - {keywords && keywords.length && ( - - )} - {metaImage && } - {metaImage && } - {metaImage && ( - - )} - {permalink && } - {permalink && } - - -
-
- -
-
- {showVersionBadge && ( -
- - Version: {version.label} - -
- )} - {!hideTitle && ( -
-

{title}

-
- )} - {DocContent.frontMatter.authors && ( -
-
- {DocContent.frontMatter.authors.map(author => { - return
{'Profile
Author:
{authorLookup[author].name}, {authorLookup[author].title}
- })} -
-
- )} -
- -
-
- {(editUrl || lastUpdatedAt || lastUpdatedBy) && ( -
-
- {(! DocContent.frontMatter.hasOwnProperty('isEditable') || DocContent.frontMatter.isEditable === true) && ( -
- {editUrl && ( - - - Edit this page - - )} -
- )} - {(lastUpdatedAt || lastUpdatedBy) && ( -
- - - Last updated{' '} - {lastUpdatedAt && ( - <> - on{' '} - - {lastUpdatedBy && ' '} - - )} - {lastUpdatedBy && ( - <> - by {lastUpdatedBy} - - )} - {process.env.NODE_ENV === 'development' && ( -
- - {' '} - (Simulated during dev for better perf) - -
- )} - - -
- )} -
-
- )} - {(! DocContent.frontMatter.hasOwnProperty('useNextPrev') || DocContent.frontMatter.useNextPrev === true) && ( -
- -
- )} -
-
- {!hideTableOfContents && DocContent.toc && ( -
- -
- )} -
- - ); -} - -export default DocItem; diff --git a/src/theme/DocItem/styles.module.css b/src/theme/DocItem/styles.module.css deleted file mode 100644 index dd85b881c3..0000000000 --- a/src/theme/DocItem/styles.module.css +++ /dev/null @@ -1,52 +0,0 @@ -/** - * Copyright (c) Facebook, Inc. and its affiliates. - * - * This source code is licensed under the MIT license found in the - * LICENSE file in the root directory of this source tree. - */ - -.docTitle { - font-size: 3rem; - margin-bottom: calc(var(--ifm-leading-desktop) * var(--ifm-leading)); -} - -.docItemContainer { - margin: 0 auto; - padding: 0 0.5rem; -} - -@media only screen and (min-width: 997px) { - .docItemCol { - max-width: 75% !important; - } -} - -@media only screen and (max-width: 996px) { - .docItemContainer { - padding: 0 0.3rem; - } -} - -.docLastUpdatedAt { - font-weight: bold; -} - -.authorByline { - margin-top: 6px; - display: flex; - align-items: center; -} - -.authorLabel { - padding-top: 5px; - line-height: 0.5; - font-weight: bold; -} - -.authorProfileImage { - display: inline-block; - border-radius: 100%; - width: 40px; - height: 40px; - margin-right: 8px; -} diff --git a/src/theme/DocSidebar/index.js b/src/theme/DocSidebar/index.js deleted file mode 100644 index 0d8f7f609f..0000000000 --- a/src/theme/DocSidebar/index.js +++ /dev/null @@ -1,212 +0,0 @@ -/** - * Copyright (c) Facebook, Inc. and its affiliates. - * - * This source code is licensed under the MIT license found in the - * LICENSE file in the root directory of this source tree. - */ -import React, { useState, useCallback, useEffect, useRef } from 'react'; -import clsx from 'clsx'; -import { useThemeConfig, isSamePath } from '@docusaurus/theme-common'; -import useUserPreferencesContext from '@theme/hooks/useUserPreferencesContext'; -import useLockBodyScroll from '@theme/hooks/useLockBodyScroll'; -import useWindowSize, { windowSizes } from '@theme/hooks/useWindowSize'; -import useScrollPosition from '@theme/hooks/useScrollPosition'; -import Link from '@docusaurus/Link'; -import isInternalUrl from '@docusaurus/isInternalUrl'; -import Logo from '@theme/Logo'; -import IconArrow from '@theme/IconArrow'; -import IconMenu from '@theme/IconMenu'; -import styles from './styles.module.css'; -const MOBILE_TOGGLE_SIZE = 24; - -import useBaseUrl from '@docusaurus/useBaseUrl'; - -function usePrevious(value) { - const ref = useRef(value); - useEffect(() => { - ref.current = value; - }, [value]); - return ref.current; -} - -const isActiveSidebarItem = (item, activePath) => { - if (item.type === 'link') { - return isSamePath(item.href, activePath); - } - - if (item.type === 'category') { - return item.items.some(subItem => isActiveSidebarItem(subItem, activePath)); - } - - return false; -}; - -function DocSidebarItemCategory({ - item, - onItemClick, - collapsible, - activePath, - ...props -}) { - const { - items, - label - } = item; - const isActive = isActiveSidebarItem(item, activePath); - const wasActive = usePrevious(isActive); // active categories are always initialized as expanded - // the default (item.collapsed) is only used for non-active categories - - const [collapsed, setCollapsed] = useState(() => { - if (!collapsible) { - return false; - } - - return isActive ? false : item.collapsed; - }); - const menuListRef = useRef(null); - const [menuListHeight, setMenuListHeight] = useState(undefined); - - const handleMenuListHeight = (calc = true) => { - setMenuListHeight(calc ? `${menuListRef.current?.scrollHeight}px` : undefined); - }; // If we navigate to a category, it should automatically expand itself - - - useEffect(() => { - const justBecameActive = isActive && !wasActive; - - if (justBecameActive && collapsed) { - setCollapsed(false); - } - }, [isActive, wasActive, collapsed]); - const handleItemClick = useCallback(e => { - e.preventDefault(); - - if (!menuListHeight) { - handleMenuListHeight(); - } - - setTimeout(() => setCollapsed(state => !state), 100); - }, [menuListHeight]); - - if (items.length === 0) { - return null; - } - - return
  • - - {label} - -
      { - if (!collapsed) { - handleMenuListHeight(false); - } - }}> - {items.map(childItem => )} -
    -
    • ; -} - -function DocSidebarItemLink({ - item, - onItemClick, - activePath, - collapsible: _collapsible, - ...props -}) { - const { - href, - label - } = item; - const isActive = isActiveSidebarItem(item, activePath); - return
  • - - {label} - -
    • ; -} - -function DocSidebarItem(props) { - switch (props.item.type) { - case 'category': - return ; - - case 'link': - default: - return ; - } -} - -function DocSidebar({ - path, - sidebar, - sidebarCollapsible = true, - onCollapse, - isHidden -}) { - const [showResponsiveSidebar, setShowResponsiveSidebar] = useState(false); - const { - navbar: { - hideOnScroll - }, - hideableSidebar - } = useThemeConfig(); - const { - isAnnouncementBarClosed - } = useUserPreferencesContext(); - const { - scrollY - } = useScrollPosition(); - useLockBodyScroll(showResponsiveSidebar); - const windowSize = useWindowSize(); - useEffect(() => { - if (windowSize === windowSizes.desktop) { - setShowResponsiveSidebar(false); - } - }, [windowSize]); - return
    - {hideOnScroll &&
    } -
    - -
      - {sidebar.map(item => { - e.target.blur(); - setShowResponsiveSidebar(false); - }} collapsible={sidebarCollapsible} activePath={path} />)} -
    -
    - {hideableSidebar && } -
    ; -} - -export default DocSidebar; diff --git a/src/theme/DocSidebar/styles.module.css b/src/theme/DocSidebar/styles.module.css deleted file mode 100644 index 33a82edb9f..0000000000 --- a/src/theme/DocSidebar/styles.module.css +++ /dev/null @@ -1,121 +0,0 @@ -/** - * Copyright (c) Facebook, Inc. and its affiliates. - * - * This source code is licensed under the MIT license found in the - * LICENSE file in the root directory of this source tree. - */ - -:root { - --collapse-button-bg-color-dark: #2e333a; -} - -@media (min-width: 997px) { - .sidebar { - display: flex; - flex-direction: column; - height: 100vh; - position: sticky; - top: 0; - padding-top: var(--ifm-navbar-height); - width: var(--doc-sidebar-width); - transition: opacity 50ms ease; - } - - .sidebarWithHideableNavbar { - padding-top: 0; - } - - .sidebarHidden { - opacity: 0; - height: 0; - overflow: hidden; - visibility: hidden; - } - - .sidebarLogo { - display: flex !important; - align-items: center; - margin: 0 var(--ifm-navbar-padding-horizontal); - min-height: var(--ifm-navbar-height); - max-height: var(--ifm-navbar-height); - color: inherit !important; - text-decoration: none !important; - } - - .sidebarLogo img { - margin-right: 0.5rem; - height: 2rem; - } - - .menu { - flex-grow: 1; - padding: 0.5rem; - } - - .menuLinkText { - cursor: initial; - } - - .menuLinkText:hover { - background: none; - } - - .menuWithAnnouncementBar { - margin-bottom: var(--docusaurus-announcement-bar-height); - } - - .collapseSidebarButton { - display: block !important; - background-color: var(--ifm-button-background-color); - height: 40px; - position: sticky; - bottom: 0; - border-radius: 0; - } - - .collapseSidebarButtonIcon { - transform: rotate(180deg); - margin-top: 4px; - } - - html[data-theme='dark'] .collapseSidebarButton { - background-color: var(--collapse-button-bg-color-dark); - border: none; - border-left: 1px solid var(--ifm-toc-border-color); - } - - html[data-theme='dark'] .collapseSidebarButton:hover, - html[data-theme='dark'] .collapseSidebarButton:focus { - background-color: var(--ifm-color-emphasis-200); - } -} - -.sidebarLogo, -.collapseSidebarButton { - display: none; -} - -.sidebarMenuIcon { - vertical-align: middle; -} - -.sidebarMenuCloseIcon { - display: inline-flex; - justify-content: center; - align-items: center; - height: 24px; - font-size: 1.5rem; - font-weight: var(--ifm-font-weight-bold); - line-height: 0.9; - width: 24px; -} - -:global(.menu__list) :global(.menu__list) { - overflow-y: hidden; - will-change: height; - transition: height var(--ifm-transition-fast) linear; -} - -:global(.menu__list-item--collapsed) :global(.menu__list) { - height: 0px !important; -} diff --git a/src/theme/RedisCard/styles.css b/src/theme/RedisCard/styles.css index 53f7b11c0a..e8ce90f9c9 100644 --- a/src/theme/RedisCard/styles.css +++ b/src/theme/RedisCard/styles.css @@ -63,4 +63,4 @@ } - \ No newline at end of file +