title: How to format code of react native in atom
body: <p>I am working on <code>react-native</code> app. I am using <code>atom</code> text editor for the development of <code>react-native</code> apps.</p>
  
  <p>I did not find any shortcut to format <code>react-native</code> code in atom. I tried beautify package <a href="https://atom.io/packages/atom-beautify" rel="noreferrer">https://atom.io/packages/atom-beautify</a> but it is not working. </p>
  
  <pre><code>import React, {
      Component
  } from 'react';
  import {
      AppRegistry,
      Image,
      View,
      Text,
      Button,
      StyleSheet
  } from 'react-native';
  
  class SplashScreen extends Component {
      render() {
          return ( &lt;
              View style = {
                  styles.container
              } &gt;
              &lt;
              Image source = {
                  require('./img/talk_people.png')
              }
              style = {
                  {
                      width: 300,
                      height: 300
                  }
              }
              /&gt; &lt;
              Text style = {
                  {
                      fontSize: 22,
                      textAlign: 'center',
                      marginTop: 30
                  }
              } &gt; Never forget to stay in touch with the people that matter to you. &lt; /Text&gt; &lt;
              View style = {
                  {
                      marginTop: 30
                  }
              } &gt; &lt; Button title = "CONTINUE"
              color = "#FE434C" / &gt; &lt; /View&gt; &lt;
              /View&gt;
          );
      }
  }
  
  const styles = StyleSheet.create({
      container: {
          backgroundColor: '#FFFFFF',
          margin: 50,
          alignItems: 'center',
          flex: 1,
          flexDirection: 'column'
      }
  })
  
  AppRegistry.registerComponent('Scheduled', () =&gt; SplashScreen);
  </code></pre>