Set up a local development environment
How to setup a local development environment for development for Edge Delivery Services.
Transcript
How to install a command line in your project To get started with development, it is easiest to install the AEM command line interface, CLI, and clone your repo locally through using the following. From there change into your project folder and start your local development environment using the following. This opens localhost on port 3000 and you are ready to make changes. A good place to start is in the blocks folder which is where most of the styling and code lives for a project. Simply make a change in a .css or .js and you should see the changes in your browser immediately. Once you are ready to push your changes, simply use git to add, commit, and push in your code to your preview and production sites.
Steps outlined in video
-
Install the AEM CLI
code language-none $ sudo npm install -g @adobe/aem-cli
-
Change directory to your project directory that is a git repository made from the template.
code language-none $ git clone git@github.com:my-org/my-project.git $ cd my-project
-
Run the AEM CLI to start the local AEM instance.
code language-none $ pwd /Users/my-user/my-project $ aem up ___ ________ ___ __ __ / | / ____/ |/ / _____(_)___ ___ __ __/ /___ _/ /_____ _____ / /| | / __/ / /|_/ / / ___/ / __ `__ \/ / / / / __ `/ __/ __ \/ ___/ / ___ |/ /___/ / / / (__ ) / / / / / / /_/ / / /_/ / /_/ /_/ / / /_/ |_/_____/_/ /_/ /____/_/_/ /_/ /_/\__,_/_/\__,_/\__/\____/_/ info: Starting AEM dev server vx.x.x info: Local AEM dev server up and running: http://localhost:3000/ info: Enabled reverse proxy to https://main--my-project--my-org.hlx.page opening default browser: http://localhost:3000/
-
Open http://localhost:3000/ your web browser to see your AEM web site.
recommendation-more-help
bb44cebf-d964-4e3c-b64e-ce882243fe4d