503 Service unavailable

Hi Guys ,

This blog is about the error 503 Sevice unavailable.

The complete error details are as follows

Service Unavailable
The server is temporarily unable to service your request due to maintenance downtime or capacity problems. Please try again later.

Size of a request header field exceeds server limit

Hi Guys,
This blog is about the error
Bad Request
Your browser sent a request that this server could not understand.
Size of a request header field exceeds server limit.

This error can be fixed by increasing the size

Host a website Amazon S3

Hey Guys ,

This blog is on how to host a static website using Amazon S3 .

1. Login to AWS free tier .

2. goto Amazon S3 .

3. Create a bucket .

4. Add the files of your website

5. Go to Permissions Tab and   edit Block Public Access . Switch off Block all public access .

6 . Goto static Website hosting and Enable it .

7. Go to Bucket policy and change it to public .

Attempted import error: does not contain a default export

Hi Guys ,

This blog is about the error
Attempted import error: does not contain a default export .

The full error log is as follows :

Attempted import error: './header/Top.js' does not contain a default export (imported as 'Top').

If you are new to react development you may face this error .

The fix is simple , in the component file you need to add the export statement like the one below .

export default Top;

Thanks !

'React' is not defined no-undef

Hi Guys ,

This blog is about the error
'React' is not defined no-undef .

The full error log is as follows :

./src/header/Top.js
  Line 3:26:  'React' is not defined                   no-undef
  Line 9:14:  'React' must be in scope when using JSX  react/react-in-jsx-scope

Search for the keywords to learn more about each error.

This is an error we face when we create a new component in react js .

The fix is quite simple .

check if you have missed the import for react , if it is missing add the following line at the top of your file .

import React from 'react';

Thanks !

scss vs sass

Hey Guys !

This is a blog on the differences between SCSS and SASS.

I keep updating this blog , so let me know your thoughts in the comments section .

Whenever I used to work on CSS I always find something missing , for example I was not able to reuse an existing class and I had to create a new class even though almost all the properties were same . Apart from inheritance there where other missing features like usage of variables . Sass provides the missing features in css .

Lets discuss on the first feature , the variables .

In sass I can use a variable name $bgcolor,

/* Use the variables */

body {

    background-color: $bgcolor;

   

  }

But since I have not defined it I will get an error

 ERROR in ./src/app/app.component.scss

Module build failed (from ./node_modules/sass-loader/lib/loader.js):

    background-color: $bgcolor;

                     ^

      Undefined variable.

  ╷

3 │     background-color: $bgcolor;

  │                       ^^^^^^^^

  ╵

  stdin 3:23  root stylesheet

So I need to define a variable like this ,

$bgcolor : lightblue;

     
Make sure you add $ symbol in the beginning of the variable name otherwise you will get an error message as

bgcolor : lightblue; ^ Expected "{". ╷ 3 │ bgcolor : lightblue; │ ^ ╵

     



Thanks !.

error TS2307: Cannot find module '@angular/fire'.

Hi Guys ,

This blog is about the error :

error TS2307: Cannot find module '@angular/fire'.





ErrorLog :

ERROR in src/app/app.module.ts(5,35): error TS2307: Cannot find module '@angular/fire'.
src/app/app.module.ts(6,40): error TS2307: Cannot find module '@angular/fire/firestore'.
src/app/app.module.ts(7,39): error TS2307: Cannot find module '@angular/fire/auth'.
src/app/app.module.ts(23,47): error TS2339: Property 'firebase' does not exist on type '{ production: boolean; }'.
src/app/auth.service.ts(2,33): error TS2307: Cannot find module '@angular/fire/auth'.
src/app/auth.service.ts(3,27): error TS2307: Cannot find module 'firebase/app'.

Thanks !