మార్కప్ యొక్క జెన్ మాస్టర్‌గా నేర్చుకోండి

మార్కప్, లేదా మార్కప్, మార్కప్ లేదా ట్యాగింగ్ భాషలను సూచిస్తుంది HTML మరియు CSS, మరియు వెబ్ టెంప్లేట్‌ను సృష్టించడానికి లేబుల్‌లను ఒక్కొక్కటిగా తెరవడం మరియు మూసివేయడం ఇవన్నీ ఎంత బాధాకరంగా ఉన్నాయో మనందరికీ తెలుసు ...

వాస్తవానికి దీనికి పరిష్కారాలు ఉన్నాయి, వాటిలో ఒకటి IDE వంటి వాటితో స్వయంపూర్తి డ్రీమ్వీవర్ ఒంటి బ్లూగ్రిఫ్ఫోన్ మీరు అతని నుండి ప్లగిన్‌లను కొనకపోతే బాధించేది o కొమోడో సవరణ చాలా భారీ... విషయం ఏమిటంటే, ఎంపికలతో లోడ్ చేయబడిన IDE లేదా కోడ్ ఎడిటర్లు తరచుగా work హించలేని మార్గాల్లో పనిని అడ్డుకుంటున్నారు; అలాంటిది డ్రీమ్వీవర్ ఇది మీరు గ్రాఫిక్‌గా ఉత్పత్తి చేసే చెత్త కోడ్‌తో నింపుతుంది మరియు భారీ, ఖరీదైన మరియు అగ్లీగా ఉంటుంది. బ్లూగ్రిఫ్ఫోన్ ఇది చాలా బాధించేది ఎందుకంటే ఇది ఉచితం, ఉచితం, కానీ సగం ఎంపికలు చెల్లింపు వినియోగదారుల కోసం ప్రత్యేకించబడ్డాయి ... అది సరదా కాదు. చివరకు మనకు ఉంది కొమోడో-సవరణ, ఇది చాలా మంచిది, శక్తివంతమైనది మరియు ఎంపికలతో నిండి ఉంది కాని ఇది భారీగా ఉంటుంది (100mb ఇడిల్) మరియు దానిని ఏర్పాటు చేయడం శ్రమతో కూడుకున్నది.

వెబ్ డెవలపర్ లేదా వెబ్ డిజైనర్ యొక్క ఉత్తమ ఆయుధం పైన వెయ్యి ఆయుధాలతో ఉన్న యుద్ధ ట్యాంక్ శైలిలో IDE కాదు, ఇది ఒక సాధారణ టెక్స్ట్ ఎడిటర్, కొన్ని ప్లగిన్లు మరియు అనారోగ్య వ్యక్తిలా టైప్ చేయగల సామర్థ్యం ... దీనికి మేజిక్ జోడించండి జెన్ కోడింగ్ మరియు వారు ఇప్పటివరకు సృష్టించిన మార్కింగ్ కోసం ఉత్తమమైన సాధనాన్ని వారి వేళ్ళలో కలిగి ఉంటారు (కనీసం నాకు).

కానీ ... ఏమిటీ జెన్ కోడింగ్?

సరళమైనది, ఇది సృష్టించబడిన HTML మరియు CSS కోసం డ్రాప్-డౌన్ సంగ్రహణ పొరగా పనిచేసే ప్రత్యేక ప్లగ్ఇన్ జావాస్క్రిప్ట్ మరియు చాలా ప్రసిద్ధ ప్రచురణకర్తలకు అందుబాటులో ఉంది (నోట్‌ప్యాడ్ ++, కొమోడో-ఎడిట్, గెడిట్, కేట్, బ్లూ ఫిష్, జియానీ, డ్రీమ్‌వీవర్, మొదలైనవి).

ఆహా, మీరు ఏమి చెప్తున్నారో నాకు ఇంకా అర్థం కాలేదు ...

కాబట్టి నేను మీకు సరళమైన ఉదాహరణతో చూపిస్తాను; డ్రాప్-డౌన్ సంగ్రహణ విషయం గుర్తుందా? సరే, దాన్ని కుదించడానికి మార్చండి, మీరు HTML / CSS కోడ్ యొక్క పంక్తిని ఒక పంక్తిలోకి తీసుకొని దాన్ని కర్టెన్ లాగా విప్పవచ్చు లేదా దాన్ని తిరిగి మడవవచ్చు అని imagine హించుకోండి ... ఎలా చూడాలనుకుంటున్నారు? ఇది పని చేయడానికి మీకు రెండు విషయాలు ఉన్నాయని నిర్ధారించుకోవాలి:

కలిగి జెన్ కోడింగ్ మీ ఎడిటర్‌లో ఇన్‌స్టాల్ చేయబడింది.
దీన్ని ఉపయోగించడానికి ఆదేశాలు మరియు వాక్యనిర్మాణం తెలుసుకోండి.

సరే, కోడ్‌కు వేళ్లు:

html>head+body

ఆ కోడ్ పంక్తిని చూశారా? HTML కోసం ఇది సింటాక్స్, ఇది చాలా సులభం:

మొదట మీరు ట్యాగ్ (html) పేరును ఉంచండి, ఆ ట్యాగ్ (>) లోపల ఏ ట్యాగ్‌లు ఉండబోతున్నాయో మీరు సూచిస్తారు, ఆపై ఆ ట్యాగ్ (తల మరియు శరీరం) లోపలికి వెళ్ళే ట్యాగ్‌ల పేరు. '+' సంకేతం తల మరియు శరీరం రెండు వేర్వేరు లేబుల్స్ అని సూచిస్తుంది మరియు రెండింటిలో మరొకటి ఉండదని సూచిస్తుంది, ఇది sayకలిసి కానీ మిశ్రమంగా లేదు«… అప్పుడు, మేజిక్ కీలను నొక్కినప్పుడు ఆ కోడ్ యొక్క పంక్తి ఏమి ఉత్పత్తి చేస్తుందో చూద్దాం (నా విషయంలో CTRL + E.):

సరిగ్గా, 4 పంక్తుల కోడ్ ఒకటిగా తయారైంది, మీరు సరైన కీ కలయికను నొక్కినప్పుడు అద్భుతంగా కనిపిస్తుంది… ఇంకా చాలా ఎక్కువ ఉండవచ్చు; ఉదాహరణకి:

html>head+body>ul#lista_ordenada>li.listilla*5

అదే వాక్యం మల్టిప్లైయర్స్… ఇవన్నీ ఏమిటి!? ఫక్ మీరు నన్ను కంగారు పెట్టారు!

ప్రశాంతంగా ఉండండి, ఇది చాలా సులభం, శరీరం లోపల ఒక ట్యాగ్ ఎంటర్ చేయమని మేము పైన చెప్పాము, వింత ఏమీ లేదు, నేను పైన వివరించాను, అప్పుడు, మేము ఒక ఐడిని కేటాయించాము, మీకు CSS తెలిస్తే ఇవి గుర్తుతో గుర్తించబడతాయని మీరు అర్థం చేసుకుంటారు '#', మరియు ఆ క్రమం లేని జాబితా (ఉల్) లోపల మేము క్లాస్ (క్లాస్) లిస్టిల్లాతో ఐదు లేబుళ్ళను జోడిస్తాము, నేను దీనిని క్లుప్తంగా వివరించాను. వాస్తవానికి ఇది చాలా సులభం, '#' ఇది ఒక ఐడి అని సూచిస్తుంది, అప్పుడు 'li.listilla' మేము క్లాస్ లిస్టిల్లా «li class = listilla with తో« li a అనే లేబుల్‌ను సృష్టించవలసి ఉందని చెప్పారు, ఆపై, మేము sayచివరి ఐదుసార్లు పునరావృతం చేయండి«. ఫలితంగా మనకు ఏమి ఇస్తుంది:

కోడ్ యొక్క పన్నెండు పంక్తులు ఒకే పంక్తిలో మరియు చాలా తక్కువ సమయంలో వ్రాయబడ్డాయి

మరియు CSS తో కూడా ఇది చేయవచ్చు, అయినప్పటికీ నేను స్పష్టంగా చూపించడం ద్వారా వ్యాసాన్ని పొడిగించను (క్రింద నేను మీకు మొత్తం చీట్స్ జాబితాను పంపుతాను జెన్ కోడింగ్).

ఒకదానిలో ఒక జిలియన్ లక్షల పంక్తులను రూపొందించడానికి ఇది పనిచేయదని నేను నొక్కి చెప్పాలి, ఓహ్, దీనికి పరిమితి మరియు దానిని ఉపయోగించడానికి ఒక మార్గం ఉంది. ఉదాహరణకు మనం ఇలాంటివి చేయాలనుకుంటే:

html>head>title+meta+body>ul#lista_ordenada>li.listilla*5

సిద్ధాంతంలో మనకు ఇది ఏమి ఇవ్వాలి (చివరి చిత్రంలో హైలైట్ చేసిన పంక్తిని చూడండి):

ఇది మాకు ఇది ఇస్తుంది:

మీరు దీనితో మేజిక్ చేయలేరని ఇది చూపిస్తుంది; కోడ్ యొక్క జెన్ మాస్టర్ ఖచ్చితంగా మరియు వేగంగా ఉండాలి అని గుర్తుంచుకోండి, మరియు తప్పుగా చేసిన పనులకు సమయం మరియు వేగం పడుతుంది, అందువల్ల, త్వరగా మరియు దానితో వ్రాయడానికి సరైన టెక్నిక్ జెన్ కోడింగ్ ఇది ఇలా ఉంటుంది:

html>head>body>ul#lista_ordenada>li.listilla*5

మీరు విస్తరించు మరియు హెడ్ ట్యాగ్ లోపల:

title+meta

ఇది మీకు సరైన కోడ్ ఇస్తుంది:

అయినప్పటికీ జెన్ కోడింగ్ మీకు చూపించడానికి ఇంకా చాలా విషయాలు ఉన్నాయి మరియు తల లోపల మరొక కమాండ్ లైన్ రాయడం ఉత్తమమైనది కాదు, కాబట్టి మేము మరొక ఆదేశాన్ని ఉపయోగిస్తాము, «సంక్షిప్తీకరణతో విస్తరించండి"నా విషయంలో ctrl + alt + e అది ఒక చిన్న పట్టీని తెరుస్తుంది, అక్కడ మనం జెన్ కోడ్ రాయవచ్చు మరియు ఇది నిజ సమయంలో ఎలా కనిపిస్తుంది. జాగ్రత్తగా ఉండండి, దీనితో ప్రతిదీ వ్రాయమని నేను సిఫారసు చేయను కాని ఇప్పటికే సృష్టించిన నిర్మాణాలలోనే వ్రాయమని, అంటే మొదట పెద్ద నిర్మాణాలను సృష్టించండి, ఆపై మీరు ఈ ఎంపికతో వాటిలో వివరంగా వివరిస్తారు.

మరియు లోపల సూపర్ కూల్ ఆదేశాలు చాలా ఉన్నాయి జెన్ కోడింగ్, విషయం ఏమిటంటే, మీరు వాటిని వ్యవస్థాపించిన తర్వాత వాటిని పరిశోధించి, వాటిని ఉపయోగించడం నేర్చుకోండి; ఈ ప్లగ్‌ఇన్‌తో మీకు css లేదా html కోసం ఆటో కంప్లీషన్ లేదా స్నిప్పెట్స్ అవసరం లేదు, వాస్తవానికి, ఈ రెండు ప్రోగ్రామింగ్ భాషల్లో ఈ ఎంపికలు మొత్తం సమయం వృధా అని మీరు గ్రహించవచ్చు

మరియు ఆసక్తి ఉన్నవారికి, ఇక్కడ అధికారిక చీట్‌షీట్ ఉంది జెన్ కోడింగ్, మీరు దీన్ని ఫార్మాట్‌లో చూడవచ్చు ODF o PDF కుడి ఇక్కడ


వ్యాసం యొక్క కంటెంట్ మా సూత్రాలకు కట్టుబడి ఉంటుంది సంపాదకీయ నీతి. లోపం నివేదించడానికి క్లిక్ చేయండి ఇక్కడ.

20 వ్యాఖ్యలు, మీదే వదిలేయండి

మీ వ్యాఖ్యను ఇవ్వండి

మీ ఇమెయిల్ చిరునామా ప్రచురితమైన కాదు.

*

*

  1. డేటాకు బాధ్యత: మిగ్యుల్ ఏంజెల్ గాటన్
  2. డేటా యొక్క ఉద్దేశ్యం: కంట్రోల్ స్పామ్, వ్యాఖ్య నిర్వహణ.
  3. చట్టబద్ధత: మీ సమ్మతి
  4. డేటా యొక్క కమ్యూనికేషన్: డేటా చట్టపరమైన బాధ్యత ద్వారా తప్ప మూడవ పార్టీలకు తెలియజేయబడదు.
  5. డేటా నిల్వ: ఆక్సెంటస్ నెట్‌వర్క్స్ (EU) హోస్ట్ చేసిన డేటాబేస్
  6. హక్కులు: ఎప్పుడైనా మీరు మీ సమాచారాన్ని పరిమితం చేయవచ్చు, తిరిగి పొందవచ్చు మరియు తొలగించవచ్చు.

  1.   మాఫన్స్ అతను చెప్పాడు

    నేను చాలా ఆసక్తికరంగా ఉన్నాను!

    నేను ఖచ్చితంగా దీన్ని ప్రయత్నించబోతున్నాను!

  2.   మాఫన్స్ అతను చెప్పాడు

    ఒక ప్రశ్న, "తల> శరీరం" అనే రూపం తల లోపల శరీరాన్ని సృష్టించలేదా? మనకు కావలసినదాన్ని పొందడానికి, మనం "తల + శరీరం" ఉంచకూడదు?

    నేను అయోమయంలో ఉంటే నన్ను క్షమించండి!

    Gracias

    1.    నానో అతను చెప్పాడు

      అవును, ">" కి ముందు ఉన్న ఏదైనా ట్యాగ్ పేరు గతంలో పేర్కొన్న ట్యాగ్‌లోకి వెళుతుందని సూచిస్తుంది; ఈ సందర్భంలో, మీరు చెప్పినట్లుగా, తల> శరీరం తల లోపలకి వెళ్తుందని సూచిస్తుంది, ఇది తప్పు అని మాకు తెలుసు.

      మరియు అవును, హెడ్ ప్లస్ బాడీ సంగ్రహించడం లాంటిది, అవి మరొక ట్యాగ్ లోపలికి వెళ్తాయని మీరు చెప్తారు, కానీ అవి రెండూ మరొకటి లోపలికి వెళ్ళవు, ఈ సందర్భంలో html> head + body

  3.   అసువర్టో అతను చెప్పాడు


    ఆమెన్

  4.   103 అతను చెప్పాడు

    చాలా, చాలా మంచిది, వ్యక్తిగతంగా నేను ఈ రకమైన విషయం కోసం సాదా టెక్స్ట్ ఎడిటర్లను ఉపయోగించటానికి ఇష్టపడతాను మరియు జెన్ కోడింగ్ నేను HTML కోసం చూసిన ఉత్తమమైనది.

    నేను దీన్ని నిజంగా ఇష్టపడ్డాను: html: xt మరియు htlm: 5 ను to హించాలనుకునే వారికి

  5.   aroszx అతను చెప్పాడు

    అయ్యో, నేను నిజంగా డ్రీమ్‌వీవర్ లాంటి ప్రోగ్రామ్‌లను ఎప్పుడూ ఉపయోగించలేదు, నేను ఈ జెన్ కోడింగ్‌ను ప్రయత్నించాలి ...

    PS: మీ వద్ద ఉన్న వాల్‌పేపర్… అనుకోకుండా నేను చేసినది ఇదేనా?

    1.    నానో అతను చెప్పాడు

      అవును కాని ఫ్రమ్‌లినక్స్ నుండి

  6.   ఎజెల్ అతను చెప్పాడు

    చాలా మంచిది, నేను ఎల్లప్పుడూ తేలికపాటి టెక్స్ట్ ఎడిటర్లను ఇష్టపడ్డాను, నేను ఇప్పుడు ఉపయోగిస్తున్నాను జియానీ మరియు మేజిక్ టీపాట్ కోసం ఇది మద్దతు ఇస్తుందని చూడటం తప్పనిసరిగా నన్ను ప్రయత్నించమని ప్రోత్సహిస్తుంది

  7.   లూపిన్ III అతను చెప్పాడు

    బాగా, ప్రోగ్రామింగ్ నా విషయం కాదు, నన్ను ఎగిరింది డెస్క్‌టాప్, మీరు ఏమి ఉపయోగిస్తున్నారు, గ్నోమ్ 3 లేదా ఐక్యత, అది ఏమిటి? ఇది చాలా బాగుంది, నేను గనిని వదిలివేస్తానో లేదో చూడటానికి
    మీరు నాకు సమాధానం ఇవ్వకపోతే, నేను చాలా కృతజ్ఞుడను
    PS: అవును, నేను కిటికీల నుండి వచ్చాను, విశ్వవిద్యాలయంలో xD ఉంది

    1.    నానో అతను చెప్పాడు

      ఐక్యత, ప్రాథమిక ఇతివృత్తంతో మరియు ప్యానెల్ యొక్క అస్పష్టతను తగ్గించింది.

      1.    నియోమిటో అతను చెప్పాడు

        నేను కిటికీలతో కూడా పని చేస్తున్నాను, మీ డెస్క్‌టాప్‌లో మిమ్మల్ని అభినందించనివ్వండి.

  8.   జాజ్ఆండ్రే అతను చెప్పాడు

    వ్యాసం చాలా ఆసక్తికరంగా ఉంది ... నేను చాలా ఉపయోగకరంగా ఉన్నాను. మార్గం ద్వారా, గెడిట్ కోసం జెన్ కోడింగ్ ప్లగ్ఇన్ యొక్క సంస్థాపన నాకు కొంత రక్షణగా ఉంది మరియు మీరు Gedit3 కోసం తగిన ప్యాకేజీని డౌన్‌లోడ్ చేసుకోవాలి. అధికారిక జెన్ కోడింగ్ సైట్‌లో గెడిట్ కోసం ప్లగిన్ యొక్క లింక్‌లు అందించబడతాయి, అయితే ఇది పాతది ఎందుకంటే ఇది గెడిట్ 2 కోసం ఎందుకంటే ఇది ఇన్‌స్టాలేషన్ సూచనల ప్రకారం ప్రస్తుత వెర్షన్ గెడిట్ 3 లో ఉపయోగించడం అసాధ్యం.

    వెర్షన్ 2 కోసం వ్రాసిన జెడిట్ ప్లగిన్లు కొత్త వెర్షన్ 3 లో పనిచేయవు, ఎందుకంటే ఇది జిటికె 3 ను ఉపయోగిస్తుంది, జెడిట్ 2 జిటికె 2 ను ఉపయోగిస్తుంది. Gedit3 లో ప్లగిన్ను ఉపయోగించడానికి మీరు ఈ క్రింది వాటిని పరిగణనలోకి తీసుకోవాలి:

    క్రొత్త డైరెక్టరీ: ~ / .లోకల్ / షేర్ / గెడిట్ / ప్లగిన్లు
    .Gedit-plugin పొడిగింపు పేరు మార్చబడాలి .plugin
    ఫైల్‌ను తెరిచి [గెడిట్ ప్లగిన్] హెడర్‌ను సవరించండి మరియు దానిని [ప్లగిన్] గా మార్చండి
    IAge = 2 కోసం IAge = 3 ని కూడా మార్చండి

    Gedit3 ను ఉపయోగించే వారు ఈ క్రింది లింక్ నుండి జెన్ కోడింగ్ ప్లగిన్ను డౌన్‌లోడ్ చేసుకోవచ్చు:

    https://github.com/mtrovo/zen-coding-gedit3

    ఇది మీకు ఉపయోగకరంగా ఉంటుందని నేను ఆశిస్తున్నాను.
    శుభాకాంక్షలు.

    1.    తిరిగి అతను చెప్పాడు

      ధన్యవాదాలు, నాకు సరిగ్గా ఆ సమస్య ఉంది !!

    2.    అలెక్స్- m7 అతను చెప్పాడు

      నాకు ఉన్న సమస్యను మీరు ఇచ్చారు. గ్రాక్స్!

  9.   ఎలింక్స్ అతను చెప్పాడు

    చాలా ఉపయోగకరంగా ఉంది, అయితే ఈ ఎడిషన్ కోసం html లేదా ఏదైనా వెబ్-ఆధారిత భాష మరియు ఇతరులు నేను బ్లూ ఫిష్ లేదా ఆప్తానా స్టూడియోని ఇష్టపడతాను.

    ధన్యవాదాలు!

    1.    నానో అతను చెప్పాడు

      కీబోర్డ్ సత్వరమార్గాలు మరియు అంశాలను అనుకూలీకరించడం వంటి కొన్ని విషయాలలో బ్లూ ఫిష్ విఫలమవుతుంది, మరియు ఈ రోజు వరకు నేను కోట్లను స్వయంపూర్తిగా చేయలేను మరియు తరువాత ఒక జంటను మూసివేయడం మర్చిపోయినందుకు నా నుండి చాలా ఇబ్బంది పడుతుంది.

      ఆప్తానా, ఇది నాకు సక్స్, ఇది కేవలం జావాలో వ్రాయబడింది మరియు నా సిస్టమ్‌కు అపాయం కలిగించే డిపెండెన్సీలను కలిగి ఉంది ... నా కోసం (బాగా అర్థం చేసుకోండి, నాకు) జావా = ఒంటి అని చెప్పలేదు.

  10.   v3on అతను చెప్పాడు

    నేను చాలాకాలంగా ఉపయోగిస్తున్నాను, సిఫార్సు చేయబడింది!

  11.   రాఫెల్ అతను చెప్పాడు

    హలో, ఎక్సెలీన్ వ్యాసం ...
    నేను జెన్ మాస్టర్‌గా భావించడం ఇష్టం లేదు :-), కానీ మీరు ప్రతిపాదించిన విస్తరణ:

    html> head> title + meta + body> ul # order_list> li.listilla * 5
    (అది విస్తరించడంలో విఫలమైంది)

    సమూహానికి కుండలీకరణాలతో దీన్ని సరిగ్గా చేయవచ్చు, ఇలాంటివి:

    html> (తల> శీర్షిక + మెటా) + (శరీరం> ఉల్ # ఆర్డర్_లిస్ట్> li.listilla * 5)
    ఇది .హించిన విధంగా విస్తరిస్తుంది

    సంబంధించి

  12.   ఫెలిపే అతను చెప్పాడు

    ఈ ప్లగ్ఇన్ నిలిపివేయబడింది మరియు దాని స్థానంలో ఎమ్మెట్ (http://emmet.io/)

  13.   ఉలిసెస్ అతను చెప్పాడు

    కేట్ కోసం ఆర్చ్లినక్స్లో నేను దీన్ని ఎలా ఇన్స్టాల్ చేస్తానో ఎవరికైనా తెలుసా? ధన్యవాదాలు.

బూల్ (నిజం)