Created (EN) First Steps - Installation and Setup (markdown)

(EN)-First-Steps---Installation-and-Setup.md

@@ -0,0 +1,159 @@
+# (EN) First Steps - Installation and Setup
+
+## This article is about the first configuration. All important steps for installation and setup of ESPHome and the Blueprint are described here.
+
+
+ 
+> ### _**ATTENTION! if you have already installed the version "nspanel-lovelace-ui" from joBr99 on your NSPanel, an intermediate step is necessary - otherwise it is not possible to install this or any other version**_. 
+
+   
+   
+
+***
+
+    
+# Content:
+
+1. 
+2. 
+3. 
+4. 
+
+   
+
+***
+
+   
+   
+
+## 1. short version of the setup of Esphome and Blueprint.
+> _**(for those who already have experience with ESPhome and Home Assistant)**_
+
+1. First you have to install the Blueprint. For this please use the following link
+
+[![Open your Home Assistant instance and show the blueprint import dialog with a specific blueprint pre-filled.](https://my.home-assistant.io/badges/blueprint_import.svg)](https://my.home-assistant.io/redirect/blueprint_import/?blueprint_url=https%3A%2F%2Fgithub.com%2FBlackymas%2FNSPanel_HA_Blueprint%2Fblob%2Fmain%2Fnspnael_blueprint.yaml)
+
+> It is also possible to copy the code from the file _**"nspnael_blueprint.yaml "**_ and paste it into HA.
+> You can find instructions for this under [Using Automation Blueprints](https://www.home-assistant.io/docs/automation/using_blueprints/) und [Automation blueprint tutorial](https://www.home-assistant.io/docs/blueprint/tutorial/#create-the-blueprint-file)
+
+2. in the next step you have to create a new ESP32 device in ESPHome
+
+3. when the new ESP32 device has been created, next click _**"Edit "**_ on the device you have just created to open the web editor. Now the following code must be copied and pasted.
+
+> _**IMPORTANT!**_ The already existing code in the ESPHome file must be _**"COMPLETELY "**_ deleted and _**"REPLACED "**_ by the code below.
+
+> _**IMPORTANT!**_ in the block _**"CHANGE ME "**_ all values _**(device_name, wifi_ssid, wifi_password, ota_password)**_ in the _**""**_ must be replaced by your own values. It is also possible to work here with _**"!secret "**_.
+
+
+> _**ATTENTION!**_ for _**"device_name "**_ max. 15 characters _**[a-z] and [0-9]**_ may be used and all must be _**"lowercase"**_. Furthermore, characters like _**[-], [SPECIAL CHARACTARS] and [SPACES]**_ are forbidden and will cause problems with the blueprint.
+
+**Example:** _**nspanel_blackymas**_
+
+ 
+### CODE:
+```
+substitutions:
+
+###### CHANGE ME ######
+
+  device_name: "YOUR NSPANEL_NAME" 
+  wifi_ssid: "YOUR WIFI SSID"
+  wifi_password: "YOUR WIFI PASSWORD"
+  ota_password: "YOUR WIFI PASSWORD"
+
+##### CHANGE ME #####
+
+
+
+##### DO NOT CHANGE ANYTHING! #####
+
+  nextion_update_url: "https://raw.githubusercontent.com/Blackymas/NSPanel_HA_Blueprint/main/nspanel.tft"
+packages:
+  ##### download esphome code from Github
+  remote_package:
+    url: https://github.com/Blackymas/NSPanel_HA_Blueprint
+    ref: main
+    files: [nspanel_esphome.yaml]
+    refresh: 300s
+
+##### DO NOT CHANGE ANYTHING! #####
+```
+
+ 
+
+4. Now the NSPanel can be flashed with the new ESPHome code. 
+> how to flash the NSPanel you can see here [HOW TO - Flash Sonoff NSPanel with ESPHome](https://www.youtube.com/watch?v=p-AK4o5jOSI)
+
+5. After the NSPanel is flashed, you can go to _**"Settings --> Devices & Services --> Add Integration "**_ to add your new device and finish setting it up.
+
+6. In the last step, only the TFT must be uploaded. To do this, open your new device in the ESPHome integration and activate the item _**"Update TFT display "**_ under _**"Configuration "**_. Now the current TFT file is loaded from Github and uploaded to your NSPanel. _**ATTENTION!**_ this process may take a moment.
+
+7. now the setup of ESPHome and NSPanel is completed.
+
+8. Now you can configure your NSPanel via the Blueprint. To do this, go to _**"Settings --> Automations & Scenes --> Templates --> NSPanel Configuration --> CREATE AUTOMATION "**_ and start with the setup of the NSPanel.
+
+> _**NOTE!**_In the blueprint, in the _**"ESPHOME Node Name "**_ field, enter exactly the same name that you assigned in the _**"ESPHome File"**_.
+
+> **Beispiel:** _**nspanel_blackymas**_
+
+   
+   
+
+***
+
+   
+  
+##  2. Version "nspanel-lovelace-ui" by joBr99 was previously installed
+> _**in the version "nspanel-lovelace-ui" from joBr99 are a few special features built in, which make it not so easy to flash a new version and TFT on the NSPanel. But since we already had this problem, we have of course already a solution for you ;)**_
+
+### _**It is necessary to upload a "Blank TFT" file while "Lovelace ui" is still installed on the NSPanel.**_
+
+> IMPORTANT! If you have already installed the NSPanel with my version, you must first fully install "Lovelace ui" again.
+
+### The following steps are necessary:
+
+1. download the file _**"nspanel_blank.tft "**_ from the folder _**custom_configuration**_.
+2. now upload the TFT file _**"nspanel_blank.tft "**_ to the folder _**"www "**_ in Home Assistant
+3. now go to the item _**"Developer tools --> Services "**_ and search there for the services
+   
+_**"ESPHome: DEVICE_NAME_upload_tft"**_  --> (esphome.device_name_upload_tft)
+4. under URL you have to enter the path to your file _**nspanel_blank.tft**_. This could look like this
+_**"http://IP_HOME_ASSISTANT:8123/local/nspanel_blank.tft"**_
+5. now the TFT file should be played on the NSPanel. It may take a moment until it is ready
+6. If everything worked, you should see only a white page on the NSPanel.
+7. now you can continue with the setup and configuration of my version. For this see [Kurz Version der Einrichtung von Esphome und Blueprint](https://github.com/Blackymas/NSPanel_HA_Blueprint/wiki/(DE)-Erste-Schritte-%7C-Installation-und-Einrichtung#1-kurz-version-der-einrichtung-von-esphome-und-blueprint) 
+
+
+
+
+
+   
+   
+
+***
+
+   
+  
+##  3. Advanced configuration for all ESPHome and Home Assistant professionals
+
+* Blueprint file _**"nspnael_blueprint.yaml "**_ can also be installed manually.
+* ESPHome file_**"nspanel_esphome.yaml "**_ can also be installed manually. This allows to activate or add more _**"Advanced "**_ configurations.
+* There is also the possibility to upload the TFT file _**"nspanel.tft "**_ manually. The whole thing can also be combined with a _**"Folder Watcher "**_.
+* additionally we provide the HMI file _**"nspanel.HMI "**_ for the Nextion Editor to customize graphics and programming if needed
+
+> _**ATTENTION!**_ If you use this mode, you should know what you are doing. We do not give support here!
+
+
+
+
+
+
+   
+   
+
+***
+
+   
+   
+##  4. Step by Step Configuration and setup of ESPHome and Blueprint
+> _**(for all those who are new to ESPhome or have no experience yet)**_